Universal Tokens

Tailwind has a great collection of colors & other design tokens.

Now you can use them without adapting utility classes.

Get Started
CSS VariablesES ModuleJSONSASS variablesSASS mapCJS module
--tw-spacing-8--tw-text-xl--tw-color-blue-500--tw-rounded-xl--tw-shadow-sm
theme.spacing.8theme.shadow.smimport { Spacing8, TextXl, ColorBlue500 }
map-get($tw-tokens, 'color-blue-500')$tw-spacing-8$tw-text-xl$tw-rounded-xl
colorsspacingtypographyrounded cornersshadowsbreakpoints