NodlumeModular scale calculator
Calculate a modular type scale right here — no account needed. Pick a base font size and a scale ratio (minor third, perfect fourth, golden ratio, or your own), watch every type size render at its real size, and copy the result as Tailwind v4 @theme typography tokens — --text-xs through --text-4xl — ready to paste into any Tailwind CSS project.
The five boxing wizards jump
The five boxing wizards jump
The five boxing wizards jump
The five boxing wizards jump
The five boxing wizards jump
The five boxing wizards jump
The five boxing wizards jump
The five boxing wizards jump
Tailwind v4 @theme tokens — paste into your globals.css.
@theme {
--text-xs: 0.625rem;
--text-sm: 0.8125rem;
--text-base: 1rem;
--text-lg: 1.25rem;
--text-xl: 1.5625rem;
--text-2xl: 1.9688rem;
--text-3xl: 2.4375rem;
--text-4xl: 3.0625rem;
}
/* Generated with Nodlume — https://nodlume.dev/type-scale */
Real modular scale math
Every step is base size × ratio^step, rounded to the half-pixel — the same eight-step scale (xs through 4xl) the Nodlume theme system computes, not an approximation of it.
Classic ratios, one click
The named musical-interval ratios — major second, minor third, perfect fourth, augmented fourth, perfect fifth, golden ratio — plus a free field for any custom font size ratio you want to try.
Tailwind v4 tokens out
The export is a @theme block of --text-* variables in rem — exactly what Tailwind's text utilities read, so your whole typography scale changes in one place.
Make it part of a whole design system
This scale is one knob of the Nodlume theme editor — pair it with curated palettes, font pairings, radius, shadows and spacing in the free theme generator, or design your whole app on a visual canvas and export a real Next.js project with the tokens already wired in.