Home › Guides › Best Image Sizes for Websites
Best Image Sizes for Websites
Advertisement
| Use | Width (px) | Target file size |
|---|---|---|
| Full-width hero | 1920–2400 | < 300 KB |
| Blog / content image | 1200–1600 | < 150 KB |
| Product photo | 1000–2000 (square) | < 200 KB |
| Thumbnail / card | 400–600 | < 50 KB |
| Logo | SVG, or PNG at 2× display size | < 20 KB |
| Open Graph share image | 1200 × 630 | < 300 KB |
Size images to about twice their displayed CSS width for sharp retina screens, then compress. Large images are the most common cause of a poor Largest Contentful Paint score.
FAQ
How many KB should a website image be?
Most content images can be under 150 KB and heroes under 300 KB without visible loss using WebP or JPG at quality 75–82.
Should I always use 2× images?
For key images, yes; for decorative backgrounds 1.5× is usually enough.
More guides
Advertisement
Free calculator by PixSquish