Tailwind CSS

Summary

A utility-first CSS framework where you compose designs directly in markup using small, single-purpose classes (`flex`, `p-4`, `text-lg`) instead of writing custom CSS. Its utility-first model can make styles local and predictable, but teams still need conventions for component boundaries, repeated patterns, responsive behavior, and design tokens.

• 1Rebuild one existing component using only Tailwind utility classes. Validate your understanding by applying it in a small practical example.
• 2Learn Tailwind's responsive (`sm:`, `md:`) and state (`hover:`, `focus:`) prefixes. Focus on understanding the underlying reason it works, not only memorizing the definition.
• 3Read about `@apply` for extracting repeated utility patterns into components.