Tailwind spacing scale

← All tools

Match a class, rem, or px value to the default scale — or generate custom--spacing-* @theme tokens from a base unit and multipliers.

~~~

Find a match

Default scale

KeyrempxExamples

No rows match that filter.

Presets

Generator

KeyrempxUtility

@theme output

Lookup query and custom scale settings can be shared via the URL.

~~~

About this tool

Tailwind’s default spacing scale is multiples of 0.25rem (4px at a 16px root). Keys like 4 mean 1rem /16px and power utilities such as p-4,gap-4, and w-4.

In v4 you can set the base with --spacing and add named tokens with --spacing-18, etc., inside @theme. Values that don’t land on the scale can use arbitrary classes likep-[18px].

~~~

Read more