Tailwindcss Brand Colors

Tailwind plugin for adding the STEMuli design system tokens as utility classes

Installation

Add this plugin to your project:

npm install stemuli-tailwind-plugin --save

Add it to the plugins array of your Tailwind config:

// tailwind.config.js
plugins: [require("stemuli-tailwind-plugin")],

Usage:

You can use the design utilities in your class names like you would regular tailwind ones

<div class="bg-primary">Hello World</div>

For border color:

<div class="border-primary border">Hello World</div>

For text color:

<p class="text-primary">Hello World</p>