Enter width and height to see the ratio, frame shape, and a copy-ready CSS snippet.
Input size
When the ratio is locked, changing width or height updates the other side to keep the same shape.
Current ratio
--Enter dimensions to render the frame preview, ratio details, and scaled sizes.
Quick presets
LivePreview stage
Primary frame
Add dimensions to see whether the frame feels closer to a cover, poster, or widescreen canvas.
Preview updates live as you switch examples, fit modes, and dimensions.
Common width scaling
These cards show the matching height for a few practical widths.
Enter width and height, load a preset or example, then copy the reduced aspect-ratio CSS snippet or compare the visual frame preview.
Examples: compare 4:5 social posts, 16:9 slides, portrait reels, or A4 print layouts before exporting assets.
FAQ: The board calculates ratio math and preview shapes locally in the browser. It helps with planning and CSS snippets, but it does not resize files or export finished images.