Type Scale Visual Calculator

A typographic scale is a key part of UI design as it provides a visual hierarchy and guides the user through the content of an application. When applied responsively, it provides an optimised experience across all devices.

The Type Scale visual calculator is a tool that allows you to visualise the selected typographic scale. Using the tool is as simple as defining the base font size and selecting the scale you want. The scale can then be visualised and amended if necessary. The scale provides the font sizes in pixel and rem values for each heading. CSS is generated with the selected styles and can be used to give developers a head start when building the application.


Check out my website: