styledictionarytailwindbridge icon indicating copy to clipboard operation
styledictionarytailwindbridge copied to clipboard

A Design System based on Style Dictionary Tokens, converted into TailwindCSS Objects, which are then imported into the tailwind.config.js.

Styledictionarytailwindbridge

A Bridge between Amazons Styledictionary Tokens Build System and TailwindCSS.

Introduction

Wouldn't it be nice to inject your Amazon Styledictionary Custom Properties to your tailwind.config.js?

The Bridge

You can find more informations about the process of converting the style dictionary tokens to custom tailwind formats inside the styledictionary tailwind formats section.

The Documentation

To show the final outcome, i created a little Angular/TailwindCSS App based on the generated tokens. This demo is hosted under the pseudonym Stylewind on Netlify(https://www.netlify.com/).