Tailwind CSS — Free Quiz Course

← All quiz courses

Test your Tailwind CSS knowledge: the utility-first approach, layout and spacing, typography, responsive design, states, and customization.

5 chapters, 50 questions. Free, no signup. Progress is saved in your browser.

~~~
  1. Chapter 1: Utility-First Fundamentals
    What utility-first means, how Tailwind classes map to CSS, why it scales, and how Tailwind generates only the classes you use.
  2. Chapter 2: Layout & Spacing
    The spacing scale, padding and margin utilities, width and height, flex and grid utilities, gap, and centering patterns.
  3. Chapter 3: Typography & Colors
    Text size and weight utilities, font families and custom fonts, line height, the color palette and shade scale, and background utilities.
  4. Chapter 4: Responsive Design & States
    Mobile-first breakpoint prefixes, hover, focus and other state variants, dark mode, and styling elements based on parent state with group.
  5. Chapter 5: Customization & Gotchas
    Extending the theme, arbitrary values, @apply, and the classic gotchas: why dynamically built class names silently fail.

Course completed

You finished every chapter — best score/.

~~~

How it works

Each chapter is a short quiz: one question at a time, with immediate feedback and an explanation after every answer. Wrong answers teach you as much as right ones.

Your progress is stored in your browser (localStorage), so you can leave and come back any time. Nothing leaves your machine, and there is no account or signup.

The questions are based on tutorials published on this site — every chapter links the related posts.