> ## Documentation Index
> Fetch the complete documentation index at: https://docs.ducky.wiki/llms.txt
> Use this file to discover all available pages before exploring further.

# Cover Art

> Displays the current track's cover art

### Preview

##### The blue background is removed when used as a browser source

<Frame
  caption={`Cover Art Overlay

http://localhost:1234/overlay/art/cover?large&radius=circle`}
>
  <img src="https://mintcdn.com/ducky-c8b7b49a/vjKpnDr0MIV4PmvF/images/duckyradio_screenshots/coverart.png?fit=max&auto=format&n=vjKpnDr0MIV4PmvF&q=85&s=21eb3f0403c435c128f6869d03c453dc" width="516" height="515" data-path="images/duckyradio_screenshots/coverart.png" />
</Frame>

## Browser Source URL

```url theme={null}
http://localhost:1234/overlay/art/cover
```

#### Browser Source Dimensions

<ResponseField name="width" type="variable" required />

<ResponseField name="height" type="variable" required />

#### URL Parameters

<AccordionGroup>
  <Accordion title="Size" defaultOpen>
    <ResponseField name="small">
      Displays a small image

      **Dimensions** | `128 x 128`

      ```url theme={null}
      http://localhost:1234/overlay/art/cover?small
      ```
    </ResponseField>

    <ResponseField name="large">
      Displays a large image

      **Dimensions** | `1024 x 1024`

      ```url theme={null}
      http://localhost:1234/overlay/art/cover?large
      ```
    </ResponseField>

    <ResponseField name="default" type="medium">
      Displays a medium-sized image (default)

      **Dimensions** | `512 x 512`

      ```url theme={null}
      http://localhost:1234/overlay/art/cover
      ```
    </ResponseField>
  </Accordion>

  <Accordion title="Border Radius">
    <ResponseField name="radius" type="number | &#x22;circle&#x22;" default="0 (square)">
      Adjusts the border radius (roundness) of the image

      #### Circular

      ```css theme={null}
      http://localhost:1234/overlay/art/cover?radius=circle /* Circular Image */
      ```

      #### Rounded (Custom Radius)

      ```css theme={null}
      http://localhost:1234/overlay/art/cover?radius=12 /* Custom Radius */
      ```

      #### Default

      ```css theme={null}
      http://localhost:1234/overlay/art/cover /* Square Radius (no radius) */
      ```
    </ResponseField>
  </Accordion>

  <Accordion title="Spin">
    <ResponseField name="spin" type="0 = Counter-Clockwise | 1 = Clockwise" default="none">
      Adjusts the direction in which the image spins

      #### Default (static image)

      ```css theme={null}
      http://localhost:1234/overlay/art/cover
      ```

      #### Counter-Clockwise

      ```css theme={null}
      http://localhost:1234/overlay/art/cover?spin=0
      ```

      #### Clockwise

      ```css theme={null}
      http://localhost:1234/overlay/art/cover?spin=1
      ```
    </ResponseField>
  </Accordion>
</AccordionGroup>