This is a guide on how to create mobile wallpapers and its requirements for iOS and Android.
Design Requirements
- The design must work with both Light and Dark theme
- The design must work across various device sizes in Portrait and Landscape view for iOS and Android. Use the smallest and largest device sizes of each platform for reference - see table below for device specs
- The design must be accessible and complement our existing UI components – e.g.: If you are designing a wallpaper to be placed on the Homepage, take into consideration all the Homepage components such as the cards, text headings, buttons, links, logos, etc. and how the wallpaper will appear behind these elements
- The elements in the design should either be really small (such as a pattern), or really big so it doesn't contradict with our components
- If the client requires a disclaimer to be visible on the wallpaper, such as a trademark, ensure the placement of it will not be cut off by any of our UI elements
- Try to find out if this is a requirement in advance
- Vector-based files are preferred as final deliverables from the artist (in case a mobile designer needs to make any changes or resize things)
- Depending on what the final design is, a gradient overlay may potentially be applied on top of the wallpaper to improve accessibility
- For iOS - the gradient will be applied via code (see details below for specs)
- For Android - the gradient will be applied manually by the designer (see details below for specs)
Device Specs
Design for the following screen sizes:
|
Platform |
iOS |
Android |
|---|---|---|
|
Smallest Phone |
iPhone SE (1st Gen) |
P: 320dp x 480dp
|
|
Largest Phone |
iPhone 17 Pro Max |
P: 480dp x 800dp
|
|
Smallest Tablet |
iPad Mini (6th Gen) |
P: 600dp x 1024dp |
|
Largest Tablet |
iPad Pro 13" (7th Gen) |
P: 800dp x 1280dp |
*P - Portrait
*L - Landscape
iOS Requirements
- iOS requires final wallpaper files in PNG format
- Files should be optimized as small as possible (without compromising the quality)
- A PNG export is required for phone portrait and landscape, and tablet portrait and landscape. There are a total of 4 files:
Portrait (Phone)
- 1320px x 2868px
Landscape (Phone)
- 2868px x 1320px
Portrait (Tablet)
- 2064px x 2752px
Landscape (Tablet)
- 2752px x 2064px
Gradient Overlay
If the wallpaper requires a gradient overlay, the iOS team will apply these settings via code on top of the wallpaper:
|
Theme |
Light Theme |
Dark Theme |
|---|---|---|
|
Hex |
#FFFFFF |
#32113C |
|
Fill |
28% |
35% |
Android Requirements
- Android requires final wallpaper files in PNG at 1.5x format
- Files should be optimized as small as possible (without compromising the quality)
- A PNG export is required for both portrait and landscape views, plus a thumbnail. There are a total of 3 files:
Thumbnail
- 300×300
Portrait
- 1080x1920
Landscape
- 1920x1080
Gradient Overlay
If the wallpaper requires a gradient overlay, either the mobile designer or wallpaper designer can apply these settings within their design tool:
|
Theme |
Light Theme |
Dark Theme |
|---|---|---|
|
Hex |
#FFFFFF |
#32113C |
|
Fill |
28% |
35% |