These quick tips for images, logos, and files will help you keep everything clean, consistent, and ready to impress visitors.
Images
Quality visuals are essential for a stunning site, but oversized images can slow down your site and make navigating your site tedious for visitors.
 Images on our design templates average around 400-500 KB, per image. |
Following are some guidelines for image size and resolution:
| File Size | Dimensions |
Hero ImagesFeature images on the home page or top of other pages | 1 mb maximum for high-quality visuals | 1920 × 1080 px or wider to fill large screens cleanly |
Standard ImagesMid-page visuals that appear with other content | 300–500 kb for fast loading | 1200 × 800 px |
Avoid oversized uploads, as they will slow down your site (e.g., 5000 px-wide image when it displays at 800 px).
For photographs of artworks or art spaces, .jpg or .jpeg are best. They have a smaller file size, good for gradients and photos).
Logo
File Size
Keep your logo under 150 KB so it loads quickly without losing visual quality.
Dimensions
Aim for a width between 200-400 pixels for most website headers so the logo stays clear without dominating the layout.
Maintain a consistent aspect ratio so the logo doesn't stretch or warp across different devices or layouts.
File Format
For logos or graphics with transparency use a .png (supports transparent backgrounds).
Export the logo in
.svgformat when possible, since it stays sharp at any size and usually has a much smaller file size than.pngor.jpg.If SVG isn’t an option, use PNG for transparent backgrounds and higher quality, and JPG only if you need a smaller file and don’t require transparency.
Favicon
File Size
Keep your favicon tiny; aim for 5 KB or less so it loads instantly in the browser.
Dimensions
Use 32x32 pixels or 48x48 pixels for the main favicon so it looks clean in most browsers.
File Format
Use
.ICOfor the main favicon since it is supported by all browsers.If a
.ICOformat is unavailable, a.pngversion will suffice.