Logo
Deviant has 2 logo settings. Namely square and rectangle.
Rectangle
Desktop:
Use size 240×60 pixels for SVG logos (recommended). For PNG logos it is best to do 2 this time. So 480×120 pixels.
Mobile:
For non-SVG logos you can keep the same dimensions or 120×60 pixels
Square
Desktop and mobile:
In principle you can use any size as long as it is square. So 150×150 pixels or for example 300×300 pixels.
Banners
Deviant is a mobile first theme. This means that we first look at mobile and then at desktop. To maintain the correct proportions on all screens, it is important that all banners are rectangular.
So there are no best dimensions. By scaling the images, there will always be a little bit of clipping that will cut off a small portion of your banner.
As long as all banners have a height of 400 pixels and, for example, 800 pixels wide, then you’re fine. But this also depends on your banner settings, so for example 2 next to each other or 4, or even 1. A page wide banner is for example 2500×400 pixels. The correct width of your banner therefore depends on the number of banners in a row. That’s a bit of trial and error.
Headlines
Deviant has multiple headline options. Namely fullwidth and fullscreen.
Fullwidth
We have created 3 PSD files for the correct dimensions that you can download and use to have the correct dimensions. However, the headlines scale to the available space so you can just try it out for the best result.
Fullscreen:
The best dimensions are 1920×1080 pixels.
Other
The correct dimensions for the other images:
- Customer service image: 362×562 pixels
- Store image: 460×300 pixels
- Category images: 400×400 pixels of vierkant in elke andere afmeting.
- Brand images: 170×100 pixels