What is it?
There are different places throughout the platform, where you can make use of images. In order to get the best out of these images, here you can find the list of image ratios that we recommend for the different parts of the platform.
Please note: All measures are in pixels, but can also be seen as size ratios and divided/multiplied according to your preferences.
How does it work?
Across the ITONICS application, images play a fundamental role to attract attention and visually underline content elements or the user information display.
Content elements:
- Landing Page Banner: If you use the Standard Home Page, you have the option to add banners. The optimal image ratio is: 1125 × 430 pixels (jpg or png)
- Content tiles: For instance, in the Explorer, or when you use the detail page view, you will see a display of content elements either in a table or in a grid view. If you use the grid view,
the optimal image ratio is: 250 × 190 pixels (jpg or png) - (Hero) Banner: Besides the grid or tile view, the image of a content element can also be displayed by a hero banner. This can be helpful to promote idea campaigns but is available for any entity. Please note that this only defines the detail page view or the standard landing page but not the display in the Explorer or any list of content elements.
The optimal image ratio is: 1800 x 640 pixels (jpg or png)
User profile information:
- User Profile Picture: The user profile picture shows the user and is displayed on the User Profile or the User Tiles Tab.
The optimal image ratio is: 150 x 150 pixels (jpg or png)
- User Profile Banner: The user profile banner can be set by each user and will be reflected on their individual profile pages.
The optimal image ratio is: 1520 x 370 pixels (jpg or png)
System interface:
- Menu logo: shown on the left side of the top menu.
The optimal ratio is: there is no defined ratio, but the max height is 30 px; the max width is 100 px. - Brand logo: displayed on the login page, below the Radar, and in system emails.
The optimal ratio is: there is no defined ratio, but the max height is 30 px; the max width is 100 px. - Brand Favicon: an image that will show up on the browser window.
The optimal image ratio is: 1:1 (jpg or png)