Modular Scale

Generate scale values from a base and ratio for consistent sizing.

Base (px)

Ratio

Steps

Step -53.80px

Step -45.07px

Step -36.76px

Step -29.00px

Step -112.00px

Step +016.00px

Step +121.33px

Step +228.43px

Step +337.90px

Step +450.52px

What is a Modular Scale?

A modular scale is a sequence of numbers that relate to one another in a meaningful way. Starting from a base value, each subsequent value is multiplied by the chosen ratio. This creates harmonious proportions that can be used for font sizes, spacing, and layout.