Aspect Ratio Calculator
Keep image and video dimensions proportional with presets, custom ratios, and social-media sizes.
Social dimensions
- YouTube: 1920 × 1080
- Instagram: 1080 × 1080
- Stories: 1080 × 1920
- X / Twitter: 1200 × 675
- Facebook: 1200 × 630
How to use
- Choose a preset or enter a custom ratio.
- Edit the width or height with the ratio lock enabled.
- Use the calculated dimensions for your design or export.
About this tool
Aspect ratio describes the relationship between the width and height of an image, video, canvas, or responsive container. It is written as two numbers separated by a colon, such as 16:9, and does not depend on the absolute pixel size. This calculator helps you preserve that relationship while changing either dimension. Choose a common preset for widescreen video, classic displays, square artwork, portrait stories, cinema banners, or photographic compositions. You can also enter a custom ratio when a brand asset or product requirement uses a less familiar shape. With the lock enabled, editing width derives the matching height and editing height derives the matching width. Rounding produces whole-pixel output, which is normally the most practical value for exported graphics. The social-media suggestions provide starting dimensions for common publishing surfaces, but platform specifications can change, so check a network’s current documentation before delivery. A correct ratio prevents stretching and unexpected crops, while a larger pixel size controls sharpness and file weight separately. For responsive web design, keep the ratio in CSS with aspect-ratio and let the containing width determine the rendered height. For print, confirm the physical trim and bleed instead of relying on pixels alone. All calculations happen locally and are useful for thumbnails, landing-page media, ads, profile graphics, and video storyboards.
Frequently asked questions
Related tools
Open Graph Previewer
Preview Twitter, Discord, Telegram, and LinkedIn cards and generate an Open Graph meta-tag snippet.
Placeholder Generator
Create downloadable SVG placeholders and data URIs with custom dimensions, colors, labels, and font size.
Glassmorphism Generator
Tune blur, transparency, saturation, radius, borders, and shadows to generate glassmorphism CSS.