~//tutorials/tailwind
Tailwind CSS
Utility-first styling, at speed.
- 01What is Tailwind CSS?Style directly in your markup with utility-first CSS.beginner
- 02Install & SetupAdd Tailwind to a project with the Vite plugin.beginner
- 03Core UtilitiesSpacing, sizing, color, and typography classes you will use daily.beginner
- 04States & VariantsStyle hover, focus, dark mode, and child elements with variant prefixes.beginner
- 05Layout with Flex & GridBuild page and component layouts with flexbox and grid utilities.intermediate
- 06Responsive DesignBuild mobile-first layouts that adapt at breakpoints.intermediate
- 07Dark Mode & ThemingShip a dark theme and design tokens with CSS variables.intermediate
- 08Building ComponentsReuse markup with components and @apply for shared styles.intermediate
- 09Customizing TailwindExtend the theme, add tokens, and use arbitrary values wisely.advanced
- 10Tailwind Best PracticesPatterns that keep Tailwind codebases clean and fast.advanced