What you're missing is that there's overhead in writing CSS-in-JS. You have to switch context from HTML to JS, you have to keep track of the "link" between your CSS-in-JS and your React component, you have to deal with cascading styles, and hopefully you're able to keep all styles across all components consistent.
Tailwind cuts through all of that and says:
- Just declare the styles you want directly in the HTML
- If you're repeating styles, use @apply
- Limit the number of styles available to your project to enforce a de facto design system
Tailwind cuts through all of that and says:
- Just declare the styles you want directly in the HTML
- If you're repeating styles, use @apply
- Limit the number of styles available to your project to enforce a de facto design system