Image Size Cheat Sheet: OG, Favicon, Social Media
Nobody remembers these numbers; everybody googles them monthly. Bookmark this page instead.
Link previews (Open Graph)
| Use | Size | Notes |
|---|---|---|
| OG image | 1200 × 630 | The 1.91:1 preview card on every major platform |
| Twitter/X large card | 1200 × 628 | Same asset works fine |
One 1200×630 image under ~300 KB covers link sharing everywhere. Crop to the exact ratio with the cropper’s OG preset.
Favicons & app icons
| File | Size | Where it shows |
|---|---|---|
| favicon.ico | 16+32+48 | Browser tabs, bookmarks, legacy |
| favicon-32.png | 32 × 32 | Standard tab icon |
| apple-touch-icon.png | 180 × 180 | iOS home screen |
| icon-192 / icon-512 | 192 / 512 | Android, PWA manifest |
Generate the whole set from one square image with the favicon generator.
Social platforms
| Platform | Asset | Size |
|---|---|---|
| Feed square / portrait | 1080×1080 / 1080×1350 | |
| Instagram / TikTok | Story, Reel | 1080 × 1920 |
| YouTube | Thumbnail | 1280 × 720 |
| YouTube | Channel banner | 2560 × 1440 |
| X (Twitter) | Header | 1500 × 500 |
| Post image | 1200 × 627 |
Web page images
- Content/blog images: 1200 px wide is plenty; serve WebP.
- Full-width hero: 1920 px wide covers desktop; 2560 only if you must.
- Thumbnails: render size × 2 for high-DPI screens.
Phone photos are typically 4000+ pixels wide — far more than any of these targets. Resize first, then compress: the two steps together routinely cut 90% of the file size with zero visible loss — the full recipe is in reduce image file size in 3 steps.