AspectRat.io

AspectRat.io is a straightforward web tool that calculates aspect ratios and provides a reference for common device resolutions. You input a width and height, and it instantly gives you the corresponding aspect ratio, such as 16:9. It also generates the necessary CSS, SCSS, or LESS code to create a responsive container with that aspect ratio, which is a common requirement in modern web design to prevent layout shifts. The tool includes a list of pre-defined resolutions for popular devices like iPhones, Samsung Galaxy phones, and standard TV resolutions, making it easy to get started quickly.

The tool is built on a publicly available NPM module called 'calculate-aspect-ratio', which is also available as a command-line utility. This means developers can use the same logic in their own JavaScript projects or from their terminal. The website itself is minimal and focused, delivering the core functionality without unnecessary features. It is a practical utility that solves a specific, recurring problem in a developer or designer's workflow.

This tool is most useful for web designers and front-end developers who regularly work on responsive layouts. It saves time by automating the math needed to maintain correct proportions for images, videos, and other elements across different screen sizes. Whether you are building a new component or checking the specs for a common device, AspectRat.io provides a quick and reliable answer.