What is the intersection between a design tokens pipeline (a la Style Dictionary) and @tailwindcss?
By transforming formated JS tokens into a Tailwind config, you can use Tailwind to compose your tokens easily via utility classes.
Even better...
Tailwind can fill in the gaps for "simple" tokens (i.e. colors, typography spacing) if your design system doesn't have one.
Should your design system become more extensive to include official spacing specs, then you override Tailwind with minimal changes to the dev experience.
In a word, creating a Tailwind config from formatted design tokens gives you an asset that allows you to compose formatted design tokens in an ideal, expedited way.
Michael Mangialardi
@michaelmangial1
Christian | Frontend Engineer | Design Systems Engineer. 📚 Author of “Design Systems for Developers” and "Rethinking Agile"
