Compose Tailwind Utilities with @apply

Adam Wathan
InstructorAdam Wathan

Share this video with your friends

Send Tweet

The @apply directive lets you compose utility classes so you can re-use common styles and not litter your html with a ton of repetitive styles.

Even when using @apply directives, it's still easy to start repeating yourself in your code. We'll use the multi-class component pattern to extract the common styles into a base class and then styling (e.g. color) can be additionally applied as another class.

Stephen James
Stephen James
~ a year ago

Do you have vs code fix for the errors I see for tailwind directives @tailwind "Unknown rule @tailwind"

Adam Wathan
Adam Wathaninstructor
~ a year ago

What I do is use the postcss language mode for my CSS files instead of the css language mode and I don't get any warnings like that.