Skip to content

Typography Scale Generator

Generate a modular type scale from a base size and ratio. Preview all steps and copy as CSS or Tailwind.

6
2

Preview

5xl
5.610rem / 90px
The quick brown fox
4xl
4.209rem / 67px
The quick brown fox
3xl
3.157rem / 51px
The quick brown fox
2xl
2.369rem / 38px
The quick brown fox
xl
1.777rem / 28px
The quick brown fox
lg
1.333rem / 21px
The quick brown fox
basebase
1.000rem / 16px
The quick brown fox
sm
0.750rem / 12px
The quick brown fox
xs
0.563rem / 9px
The quick brown fox
:root {
  --text-xs: 0.563rem;    /* 9.0px */
  --text-sm: 0.750rem;    /* 12.0px */
  --text-base: 1.000rem;    /* 16.0px */
  --text-lg: 1.333rem;    /* 21.3px */
  --text-xl: 1.777rem;    /* 28.4px */
  --text-2xl: 2.369rem;    /* 37.9px */
  --text-3xl: 3.157rem;    /* 50.5px */
  --text-4xl: 4.209rem;    /* 67.3px */
  --text-5xl: 5.610rem;    /* 89.8px */
}

All processing happens in your browser. Nothing is sent to a server.

  • 100% free — no account needed
  • Runs in your browser
  • Nothing is uploaded

Frequently asked questions

Is Typography Scale Generator really free?

Yes. Typography Scale Generator is completely free on PureBrowser — every feature, with no account, no trial, and no credit card.

Does Typography Scale Generator upload my data?

No. Typography Scale Generator runs entirely inside your browser, so anything you type, paste, or open stays on your own device.

Do I need to sign up or install anything?

Neither. There is no account and nothing to download — open the page and Typography Scale Generator is ready to use on desktop or mobile.

Does Typography Scale Generator work offline?

Once the page has loaded, yes. All of the processing happens locally in your browser, so it keeps working without a connection.