Smallest whole-pixel size 3 × 4.
In CSS: aspect-ratio: 3 / 4. Rotated it becomes 4:3.
Where 3:4 is used
Portrait tablet screens, portrait-orientation photography.
Simply 4:3 rotated. Standard for anything shot vertically on a 4:3 sensor.
Rendered live with aspect-ratio: 3 / 4.
3:4 resolutions
Every size below is exactly 3:4 — no rounding. Sizes marked as a standard are named display resolutions.
| Resolution | Width | Height | Megapixels | Standard |
|---|---|---|---|---|
| 162 × 216 | 162 | 216 | 0.03 | — |
| 165 × 220 | 165 | 220 | 0.04 | — |
| 168 × 224 | 168 | 224 | 0.04 | — |
| 171 × 228 | 171 | 228 | 0.04 | — |
| 174 × 232 | 174 | 232 | 0.04 | — |
| 177 × 236 | 177 | 236 | 0.04 | — |
| 180 × 240 | 180 | 240 | 0.04 | — |
| 480 × 640 | 480 | 640 | 0.31 | — |
| 720 × 960 | 720 | 960 | 0.69 | — |
| 960 × 1280 | 960 | 1280 | 1.23 | — |
| 1080 × 1440 | 1080 | 1440 | 1.56 | — |
| 1200 × 1600 | 1200 | 1600 | 1.92 | — |
| 1440 × 1920 | 1440 | 1920 | 2.76 | — |
| 1920 × 2560 | 1920 | 2560 | 4.92 | — |
| 3840 × 5120 | 3840 | 5120 | 19.66 | — |
| 7680 × 10240 | 7680 | 10240 | 78.64 | — |
Using 3:4 in CSS
/* Modern — one line */
.box { aspect-ratio: 3 / 4; }
/* With a fixed width */
.box { width: 100%; max-width: 960px; aspect-ratio: 3 / 4; }
/* Legacy padding-top hack, if you still need it */
.box-legacy { position: relative; }
.box-legacy::before { content: ""; display: block; padding-top: 133.3333%; }
.box-legacy > * { position: absolute; inset: 0; }Devices with a 3:4 screen
| Device | Native resolution | CSS viewport | Diagonal |
|---|---|---|---|
| iPad Pro 13″ (M5) | 2064 × 2752 | 1032 × 1376 | 13″ |
| iPad Air 13″ (M4) | 2048 × 2732 | 1024 × 1366 | 13″ |
| iPad Pro 13″ (M4) | 2064 × 2752 | 1032 × 1376 | 13″ |
| iPad Air 13″ (M3) | 2048 × 2732 | 1024 × 1366 | 13″ |
| iPad Air 13″ (M2) | 2048 × 2732 | 1024 × 1366 | 13″ |
| iPad Pro 12.9″ (6th) | 2048 × 2732 | 1024 × 1366 | 12.9″ |
| iPad Pro 12.9″ (5th) | 2048 × 2732 | 1024 × 1366 | 12.9″ |
| iPad Pro 12.9″ (4th) | 2048 × 2732 | 1024 × 1366 | 12.9″ |
| iPad Pro 12.9″ (3rd) | 2048 × 2732 | 1024 × 1366 | 12.9″ |
| iPad (9th gen) | 1620 × 2160 | 810 × 1080 | 10.2″ |
Questions about 3:4
What resolution is 3:4?
3:4 is a ratio, not a fixed resolution — any size where width ÷ height equals 0.75 qualifies. The smallest whole-pixel pair is 3 × 4, and common ones include 720 × 960, 960 × 1280, 1080 × 1440, 1200 × 1600.
What is 3:4 used for?
Portrait tablet screens, portrait-orientation photography.
How do I set 3:4 in CSS?
Use the aspect-ratio property: aspect-ratio: 3 / 4;. The element then keeps that shape at any width. It is supported in every current browser.
What is 3:4 the other way round?
Rotated to landscape it becomes 4:3 — the same shape, turned 90 degrees.
How do I calculate a 3:4 height from a width?
Multiply the width by 1.333333. For example 1080 × 1.333333 = 1440. The calculator does it both directions.