There are actually no rules for working with image resolutions. What matters is how you want to use Frontify. Do you document your brand to show your employees how everything should look like? Or are you making the assets available for reuse? Will the assets even be used for printing? Is it a combination of everything?
The images are intended as previews (web usage) and not for print.
Our image manipulations are targeted for web usage and are thus in a lower resolution than the original image you uploaded. The quality used is lower than the original. This is mainly to save bandwidth and reduce loading times when displaying them online. Of course, the original file is available for download.
A few recommendations for specific areas to get the best result:
Style Guide Header Image
Background image for the header (the smallest option):
- Should be at least 90px in height. Because the design is fluid it should be as wide as the monitors are of the people viewing it.
For example 1920px * 90px would be perfect for a full-HD screen.
- The image is zoomed to the center if there’s not enough size, cropping the oversized portion of the image.
- It’s always better to upload it too big as we do optimization on every image if it’s too big.
For the bigger headers there is only a difference in the height for the 3 different header settings:
- S: 90px
- M: 380px
- L: 900px
Style Guide Image Block
- Previews are generated automatically for the best result.
- Use the @2X toggle where available to increase the quality.
We recommend using the @2X toggle to increase the quality of the image. Make sure the image is at least 1600px width for the best result.
Login Page Background and Logo
The following minimum sizes for your assets are recommended:
- Background image with at least 1600px in width.
- Your logo with a size of at least 200px in width.
Get the best result by using your monitor’s resolution.
For customization of the browser tab icon please make sure that
- file size below 2 MB
- .png format
- best size is 16x16 or higher resolution 32x32
However, if you have any unanswered questions or feedback, please do not hesitate to contact us.