Common screen resolutions
HD, Full HD, 4K, aspect ratios: the most common screen resolutions and how to recognise them.
Common resolutions
| Name | Resolution | Ratio |
|---|---|---|
| HD (720p) | 1280 × 720 | 16:9 |
| Full HD (1080p) | 1920 × 1080 | 16:9 |
| QHD / 2K (1440p) | 2560 × 1440 | 16:9 |
| 4K UHD | 3840 × 2160 | 16:9 |
| 8K UHD | 7680 × 4320 | 16:9 |
Common aspect ratios
| Ratio | Typical use |
|---|---|
| 16:9 | Screens, video, modern TVs |
| 4:3 | Older screens, some projectors |
| 21:9 | Ultrawide screens (cinema) |
| 1:1 | Social media (square posts) |
| 9:16 | Stories, vertical video (mobile) |
The "p" (720p, 1080p) stands for progressive scan — each frame is drawn in full — as opposed to the older interlaced "i" (1080i), now nearly gone.
Pixel density (PPI)
PPI = √(width_px² + height_px²) / diagonal_size_inches
The higher the PPI, the sharper the image looks at a given viewing distance — high-density ("Retina" and equivalent) screens are usually above 300 PPI.
Common web image sizes
| Context | Recommended resolution |
|---|---|
| Full-width web banner | 1920 × 600-800 px |
| Card/blog thumbnail | 800 × 600 px |
| Avatar / profile photo | 400 × 400 px |
Resolution vs. display size: don't confuse them
A 27-inch 4K screen and a 55-inch 4K screen have exactly the same resolution (3840 × 2160), but very different pixel density — the first displays a much sharper image up close, the second is meant to be viewed from a distance (a living room), where the eye no longer perceives the sharpness difference.
Common mobile resolutions
| Category | Typical resolution | Ratio |
|---|---|---|
| Standard smartphone | 1170 × 2532 (or equivalent) | ~19.5:9 |
| Compact smartphone | 750 × 1334 | 16:9 |
| Tablet | 1620 × 2160 or more | 4:3 |
For responsive design, thinking in relative units (%, rem, vw/vh) instead of fixed pixels avoids chasing an endless list of specific resolutions.
Thanks for the feedback!