CSS Spacing Scale Generator

Generate consistent spacing scales for CSS design systems.

0
0px (0.00rem)
0.5
4px (0.25rem)
1
8px (0.50rem)
1.5
12px (0.75rem)
2
16px (1.00rem)
2.5
20px (1.25rem)
3
24px (1.50rem)
4
28px (1.75rem)
5
32px (2.00rem)
6
36px (2.25rem)
8
40px (2.50rem)
10
44px (2.75rem)
12
48px (3.00rem)
:root { --space-0: 0px; --space-0.5: 4px; --space-1: 8px; --space-1.5: 12px; --space-2: 16px... }

About CSS Spacing Scale Generator

This is a free, fast, and fully client-side css spacing scale generator tool. All processing is done locally within your browser to ensure maximum privacy and security. No data is sent to our servers. Bookmark this page for quick access to ad-free, high-performance SEO and developer utilities.