Skip to content
1440px

5:4 Aspect Ratio

Exact 5:4 resolutions, the CSS you need, and where the ratio actually shows up.

Large format · landscape
5:4 = 1.25

Smallest whole-pixel size 5 × 4. In CSS: aspect-ratio: 5 / 4. Rotated it becomes 4:5.

Where 5:4 is used

1280×1024 office monitors, large-format film.

The 5:4 monitor was ubiquitous in offices around 2005 and is now almost extinct outside industrial hardware.

5:4

Rendered live with aspect-ratio: 5 / 4.

5:4 resolutions

Every size below is exactly 5:4 — no rounding. Sizes marked as a standard are named display resolutions.

Exact 5:4 pixel dimensions
ResolutionWidthHeightMegapixelsStandard
160 × 1281601280.02—
165 × 1321651320.02—
170 × 1361701360.02—
175 × 1401751400.02—
180 × 1441801440.03—
185 × 1481851480.03—
190 × 1521901520.03—
195 × 1561951560.03—
200 × 1602001600.03—
205 × 1642051640.03—
210 × 1682101680.04—
215 × 1722151720.04—
220 × 1762201760.04—
225 × 1802251800.04—
230 × 1842301840.04—
235 × 1882351880.04—
240 × 1922401920.05—
245 × 1962451960.05—
250 × 2002502000.05—
255 × 2042552040.05—
260 × 2082602080.05—
265 × 2122652120.06—
270 × 2162702160.06—
275 × 2202752200.06—
280 × 2242802240.06—
285 × 2282852280.06—
290 × 2322902320.07—
295 × 2362952360.07—
300 × 2403002400.07—
320 × 2563202560.08—
480 × 3844803840.18—
640 × 5126405120.33—
720 × 5767205760.41—
800 × 6408006400.51—
960 × 7689607680.74—
1080 × 86410808640.93—
1200 × 96012009601.15—
1280 × 1024128010241.31SXGA
1440 × 1152144011521.66—
1600 × 1280160012802.05—

Using 5:4 in CSS

CSS
/* Modern — one line */
.box { aspect-ratio: 5 / 4; }

/* With a fixed width */
.box { width: 100%; max-width: 800px; aspect-ratio: 5 / 4; }

/* Legacy padding-top hack, if you still need it */
.box-legacy { position: relative; }
.box-legacy::before { content: ""; display: block; padding-top: 80%; }
.box-legacy > * { position: absolute; inset: 0; }

Named standards at 5:4

Questions about 5:4

What resolution is 5:4?

5:4 is a ratio, not a fixed resolution — any size where width ÷ height equals 1.25 qualifies. The smallest whole-pixel pair is 5 × 4, and common ones include 640 × 512, 720 × 576, 800 × 640, 960 × 768.

What is 5:4 used for?

1280×1024 office monitors, large-format film.

How do I set 5:4 in CSS?

Use the aspect-ratio property: aspect-ratio: 5 / 4;. The element then keeps that shape at any width. It is supported in every current browser.

What is 5:4 the other way round?

Rotated to portrait it becomes 4:5 — the same shape, turned 90 degrees.

How do I calculate a 5:4 height from a width?

Multiply the width by 0.8. For example 1080 × 0.8 = 864. The calculator does it both directions.

Other aspect ratios

All resolutions on this page are computed directly from the ratio, so every pair is exact. See methodology.