Tailwind Class Explorer

Search, filter, and preview all Tailwind CSS utility classes. Click any class to copy it.

  1. Home
  2. Tailwind
  3. Class Explorer
Quick:

About This Reference

This comprehensive reference includes the most commonly used Tailwind CSS utility classes. Use the search bar to find specific classes, filter by category, or apply state variants (hover, focus, dark, etc.) to see how classes behave with prefixes.

  • Search — Type any keyword to filter classes in real time.
  • Category — Browse classes by group (Layout, Flexbox, Grid, Spacing, Typography, etc.).
  • Variant — Preview classes with responsive prefixes or state variants.
  • Click to copy — Click any class to copy it to your clipboard.

Frequently Asked Questions

What is Tailwind Class Explorer?

Tailwind Class Explorer is a free, online reference tool that lets you search, filter, and preview all Tailwind CSS utility classes directly in your browser without any installation or registration.

How do I use the search and filters?

Type any keyword (e.g. "flex", "blue", "shadow") into the search bar to filter classes in real time. Use the Category dropdown to browse by group (Layout, Flexbox, Typography, etc.) and the Variant dropdown to preview classes with responsive prefixes or state variants like hover and focus.

How do I copy a class to my clipboard?

Simply click any class card — the full class name (including the selected variant prefix) is instantly copied to your clipboard. A green confirmation message appears briefly to confirm the copy.

Is this compatible with Tailwind CSS v3 and v4?

This reference covers utility classes available in Tailwind CSS v3. For v4, some class names and configuration options may differ. Always verify against your specific Tailwind version's documentation.

Is this tool free to use?

Yes. This tool is completely free with no limitations, registration, or API key required. All processing is done locally in your browser — your data never leaves your device.

Last updated: 24 Jun 2026