AniList Banner Guide

https://cdn.discordapp.com/attachments/657393347035398148/668139328513376286/AniListBannerGuide.png If you have questions about how AniList renders your banner after uploading I made an image guide to help. It supports resolutions up to 4K 99.9 of current market. PNGhttps://cdn.discordapp.com/attachments/657393347035398148/668139328513376286/AniListBannerGuide.png Affinity Designerhttp://www.mediafire.com/file/g6fj8dnz7704kg9/AniListBannerGuide.afdesign/file Context Some of you may have noticed that AniList crops the bottom portion of your banner instead opting to zoomin instead. This is because of how the website is designed with different screen resolutions. Assuming AniLists optimal resolution of 1700 330px I can explain this behavior. The mobile version is active with screens up to a horizontal resolution of 760px. No zooming occurs here AniList only shows more of the left and right edges of the banner as the resolution increases shown by the blue section up to the magenta section. The banner section retains a height of 220px in this section. After 760px AniList changes the banner height from 220px to 330px. No zooming occurs here either up to a horizontal resolution of 1700px. However with screens wider than 1700px AniList begins to crop the image to retain a height of 330px. Only the bottom is cropped out. Because of this behavior laptop and desktop users with a resolution higher than 1366 768 1920 1080 being the next common resolution will experience a degree of cropping. 1080p loses 38 axis pixels 1440p loses 111 pixels and 4K loses an incredible 184 pixels only displaying the top 44 of the banner. Recommendation Based on these facts Id recommend keeping the most important part of the banner within the blue area in the center. Prioritize text and decal placement at the top to prevent being cropped out. Why they chose 1700px instead of the most popular 1366px or perhaps even 1920px confuses me. Edit: Added the navigation bar to the image and file by hohs recommendation. The semitransparent navigation bar covers the top 68px of the image.