Add images
Depending on the type, images can consist of line art or photographs. Your content service sends these images to the Sonos app to render.
The Sonos app displays the following image types:
| Image type | Description |
|---|---|
| Album art | Images associated with an album, artist, or playlist. |
| Custom browse icons | Art that represents a category, genre, or other container type in the Sonos app. |
| Ratings icons | Line art images that represent the rating states available to the user. |
| Service logos | Images that represent your brand and service in the music catalog. |
General image requirements
To ensure the highest-quality visual experience on the Sonos app, be sure to follow the image requirements outlined below.
PNG and JPEG files
Images must be delivered in:
- a density of 72 DPI
- JPEG or PNG format
- specific resolutions (dependent on image type)
DPI settings
Files that specify a different DPI setting may not display correctly in every Sonos app.
SVG files
You must save SVG images in the SVG Basic 1.1 profile.
Validate your SVG using the W3C Markup Validation service. Be sure that the Document Type is specifically set to SVG 1.1 Basic.
SVG line art
Do not use SVG
<mask>or<text>elements or hidden layers in your line art. Doing so will cause display problems in the Sonos app.
Supported image formats for Sonos controllers
Version 5 of the Sonos app introduced a redesign that can use the high-resolution displays of iOS and Android devices.
The Windows and MacOS apps, and discontinued Sonos hardware controllers (such as the Sonos CONTROL/CR200) are considered legacy controllers. These controllers still use images in PNG format. Therefore, you must submit your logos in PNG format as well.
The table below lists the supported Sonos apps and image formats:
| Sonos apps | Description | Legacy? | Product docs | Image format |
|---|---|---|---|---|
| ACR ACR-HDPI | Android app for tablets and phones | No | Sonos app for mobile devices | SVG |
| ICR | iOS app | No | Sonos app for mobile devices | SVG |
| CR200 | Custom Sonos controller | Yes | Sonos CONTROL (CR200) PDF | PNG |
| MDCR | Mac OS desktop app | Yes | Sonos app for Mac or PC | PNG |
| WDCR | Windows desktop app | Yes | Sonos app for Mac or PC | PNG |
Dark mode
Sonos is adding support for dark mode on iOS and Android. The Sonos apps will follow the device app theme by default and users will be able to change the app theme via their Sonos App Settings (Settings > App Preferences > Appearance).
Updated 7 months ago