Get aspect-ratio plus the padding-hack fallback for any ratio. CSS Aspect Ratio Generator is a free online tool from the ToolsRift CSS Generators collection. It runs entirely in your browser — nothing to install, no signup, and your data never leaves your device.
Loading CSS Aspect Ratio Generator…
How to use CSS Aspect Ratio Generator
Open the CSS Aspect Ratio Generator above — it loads instantly, no account needed.
Enter or upload your input. Everything is processed locally on your device.
Get your result immediately and copy or download it with one click.
Frequently asked questions
How is the padding-hack percentage calculated?
Divide height by width and multiply by 100; a 16:9 ratio becomes 56.25% top padding.
Should I use aspect-ratio or the padding hack?
Use the aspect-ratio property in modern browsers; the padding hack is a fallback for very old browsers.
Does aspect-ratio work on any element?
Yes, aspect-ratio applies to most elements when a width or height is otherwise unconstrained.
ToolsRift processes your files in your browser. We use cookies only for basic analytics and to support ads that keep every tool free. See our Cookie Policy.