Free CSS Spacing Scale Generator
Generate a spacing scale from a base size and multiplier. Outputs px and rem values as a CSS custom properties block.
100% client-side - your data never leaves your browser.
| Name | px | rem | Visual |
|---|---|---|---|
| --space-xs | 4px | 0.2500rem | |
| --space-sm | 5.04px | 0.3150rem | |
| --space-md | 6.35px | 0.3969rem | |
| --space-lg | 8px | 0.5000rem | |
| --space-xl | 10.08px | 0.6300rem | |
| --space-2xl | 12.7px | 0.7937rem | |
| --space-3xl | 16px | 1.0000rem | |
| --space-4xl | 20.16px | 1.2599rem | |
| --space-5xl | 25.4px | 1.5874rem | |
| --space-6xl | 32px | 2.0000rem |
Want automated scanning?
SCOUTb2 runs 25+ accessibility, performance, SEO, and security checks on any page automatically.
Install SCOUTb2 Free