← Tools
Tool
Type Scale Generator
Pick a base size and a scale ratio. Preview the generated steps and copy the CSS custom properties.
--text-3xl3.815rem61.04px--text-2xl3.052rem48.83px--text-xl2.441rem39.06px--text-lg1.953rem31.25px--text-md1.563rem25px--text-base1.25rem20px--text-sm1rem16px--text-xs0.8rem12.8px--text-2xs0.64rem10.24pxCSS output
:root {
--text-2xs: 0.64rem; /* 10.24px */
--text-xs: 0.8rem; /* 12.8px */
--text-sm: 1rem; /* 16px */
--text-base: 1.25rem; /* 20px */
--text-md: 1.563rem; /* 25px */
--text-lg: 1.953rem; /* 31.25px */
--text-xl: 2.441rem; /* 39.06px */
--text-2xl: 3.052rem; /* 48.83px */
--text-3xl: 3.815rem; /* 61.04px */
}