CSS Aspect Ratio Calculator
Simplify ratios and compute matching dimensions.
Inputs
Results
Generated CSS
About the CSS Aspect Ratio Calculator
Enter a width and height to get the simplified aspect ratio, decimal ratio, and the matching height for any known width. Includes a live preview box and copy-ready aspect-ratio CSS.
Examples
16:9 at 1920 wide
16 / 9, 1920pxOutput
aspect-ratio: 16 / 9; height: 1080pxKeyboard shortcuts
- Copy the main outputCtrl / ⌘ + Shift + C
- Download the resultCtrl / ⌘ + S
- Share this toolCtrl / ⌘ + Shift + S
- Reset the inputsAlt + R
- Open the tool search paletteCtrl / ⌘ + K
Related tools
CSS Clamp() Calculator
HTML & CSS
Generate fluid typography clamp() CSS from min/max viewport and size.
CSS Scrollbar Styler
HTML & CSS
Design custom scrollbars with live preview.
CSS Transform Playground
HTML & CSS
Combine translate, rotate, scale, and skew with a live preview.
CSS Variables Theme Builder
HTML & CSS
Build a custom property theme with a live preview.
Email Signature Generator
HTML & CSS
Design a professional HTML email signature and copy it into any mail client.
HTML Table Generator
HTML & CSS
Build an editable HTML table and export HTML + CSS.
Frequently asked questions
Read more
- CSS container queries vs media queries
Media queries respond to the viewport; container queries respond to the component's own box. When to use which, with working examples.
Version 1.0.0 · Updated 2026-08-07 · Runs entirely in your browser