Loadingβ¦
Loadingβ¦
Find the aspect ratio of any size, resize while keeping the ratio, and see common ratios like 16:9, 4:3 and 9:16.
Also covers: Image aspect-ratio calculator Β· Screen-ratio calculator Β· 16:9 calculator
Resize, keeping the ratio β fill one:
Aspect ratio
16:9
1.77778 : 1 β HD video, YouTube, most TVs and monitors
Decimal
1.7778
Orientation
Landscape
Resized
1,280 Γ 720
Working
.media { aspect-ratio: 16 / 9; width: 100%; object-fit: cover;}Common ratios at 1,920 wide
| Ratio | Height | Used for |
|---|---|---|
| 1:1 | 1,920 | Square: profile photos, Instagram |
| 5:4 | 1,536 | Large-format photos, old monitors |
| 4:3 | 1,440 | Classic TV, iPad, most compact cameras |
| 3:2 | 1,280 | 35 mm film, DSLRs, Surface |
| 16:10 | 1,200 | Laptops and monitors (1920 Γ 1200) |
| 16:9 | 1,080 | HD video, YouTube, most TVs and monitors |
| 1.85:1 | 1,037.84 | Cinema (flat) |
| 2:1 | 960 | Univisium, many phone screens |
| 64:27 | 810 | β21:9β ultrawide at 2560 Γ 1080 |
| 43:18 | 803.721 | β21:9β ultrawide at 3440 Γ 1440; β cinema scope (2.39:1) |
| 9:16 | 3,413.33 | Vertical video: Stories, Reels, TikTok, Shorts |
| 4:5 | 2,400 | Portrait posts (Instagram) |
| 2:3 | 2,880 | Portrait photos, Pinterest |
Any unit β pixels, inches, centimetres.
Enter a new width or height to get the other side at the same ratio.
Width and height are divided by their greatest common divisor: 1920 Γ 1080 β 16:9.
No β it's a marketing name. 2560 Γ 1080 screens are 64:27 (2.37:1) and 3440 Γ 1440 ones 43:18 (2.39:1).
Use aspect-ratio: 16 / 9 on the element; the tool gives the snippet.
Colour
Pick any colour with a saturation/brightness square, from anywhere on your screen (EyeDropper), or from a photo β and get it in HEX, RGB, HSL, OKLCH and more.
Colour
Convert any colour between HEX, RGB, HSL, HSV, HWB, CMYK, Lab, LCH, OKLab and OKLCH, with the nearest CSS colour name.
Palettes
Build a palette from one colour β a 50β950 shade scale or complementary, analogous, triadic and other harmonies, worked out in OKLCH β and export CSS, Tailwind, SCSS or JSON.
Colour
Pull the main colours out of a photo or logo, with how much of the image each covers, and export them as CSS variables or JSON.
Accessibility
Check text and background colours against WCAG 2.2 AA and AAA, see the exact contrast ratio, and get the closest colour that passes.
CSS
Design linear, radial and conic CSS gradients with any number of colour stops and vivid OKLCH blending, and copy the CSS.