Your overlays are optimised for web, tablet and mobile.
See also: Overlay design best practices
Small
| Small overlay dimensions | |
| Desktop dimensions | 375 x 420 px |
| Desktop image resolution | N/A |
| Mobile overlay dimensions | 388 x 520 (max height) px |
| Mobile image resolution | N/A |
Medium full image background
| Medium full image background | |
| Desktop dimensions | 600 x 500 px |
| Desktop image resolution | 600 x 500 px |
| Mobile overlay dimensions | 348 x 500 px |
| Mobile image resolution |
348 x 500 px Recommended retina upload: 696 x 1000 px |
Medium two columns (vertical)
| Medium two columns (vertical) | |
| Desktop dimensions | 700 x 500 px |
| Desktop image resolution | 350 x 500 px |
| Mobile overlay dimensions | 348 x 554 px with a 20 px left and right margin (appears centred on screen) |
| Mobile image resolution |
348 x 197 px Recommended retina upload: 696 x 394 px |
Medium two columns (horizontal)
| Medium two columns (horizontal) | |
| Desktop dimensions | 550 x 560 px |
| Desktop image resolution | 550 x 224 px |
| Mobile overlay dimensions | 348 x 554 px with a 20 px left and right margin (appears centred on screen) |
| Mobile image resolution |
348 x 197 px Recommended retina upload: 696 x 394 px |
Large full image (full screen)
| Large full image (full screen) | |
| Desktop dimensions | Full screen (responsive) |
| Desktop image resolution |
Responsive. Recommended: 1920 x 1080 |
| Mobile overlay dimensions | Full screen (responsive) |
| Mobile image resolution |
Responsive. Recommended: 780 x 1688 |
Large two columns (full screen)
| Large two columns (full screen) | |
| Desktop dimensions | Full screen (responsive) |
| Desktop image resolution |
Responsive. Recommended: 960 x 1080 |
| Mobile overlay dimensions | Full screen (responsive) |
| Mobile image resolution |
Responsive. Recommended: 780 x 526 |
Comments
0 comments
Article is closed for comments.