Skip to content
Free Tool Arena

Developer Utilities · Free tool

Tailwind Class Scanner

Paste HTML or JSX and get every unique Tailwind class extracted, grouped by category (layout, spacing, color, etc.). Migration + refactor tool.

Updated June 2026
33unique classes found in 8 categories
Border7
border-2border-teal-300focus-visible:ring-2focus-visible:ring-teal-500hover:border-teal-500rounded-2xlrounded-md
Color / Background4
bg-teal-600bg-whitedark:bg-slate-950hover:bg-teal-700
Effects1
shadow-lg
Flex / Grid3
gap-4items-centerjustify-between
Layout / display1
flex
Spacing4
mt-4p-6px-4py-2
Transition / Animation1
transition-colors
Typography12
dark:text-slate-100dark:text-slate-400font-boldfont-semiboldleading-relaxedline-clamp-3text-slate-600text-slate-900text-smtext-whitetext-xltracking-tight

Categorisation is heuristic — based on Tailwind's utility naming patterns. Custom classes you defined fall under "Other / custom". Responsive (sm:), state (hover:), and dark-mode prefixes are stripped before categorisation.

Found this useful?EmailBuy Me a Coffee

Advertisement

What it does

Paste HTML or JSX, get every unique Tailwind class extracted and grouped by category (layout, spacing, typography, color, border, etc.). Responsive (sm:), state (hover:), and dark-mode prefixes are stripped before categorisation.

Useful for migration audits, refactor planning, or building a class-usage report. Custom classes you defined fall under "Other / custom".

Embed this tool on your siteShow snippet

Paste this snippet into any page. Loads on-demand (lazy), no tracking scripts, and sized to most dashboards. Replace the height to fit your layout.

<iframe src="https://freetoolarena.com/embed/tailwind-class-scanner" width="100%" height="720" frameborder="0" loading="lazy" title="Tailwind Class Scanner" style="border:1px solid #e2e8f0;border-radius:12px;max-width:720px;"></iframe>
Embed docs →

How to use it

  1. Paste any markup containing class= or className= attributes.
  2. Categories + counts appear live.
  3. Copy the full space-separated list for a class-allowlist or migration plan.

Advertisement

Learn more

Explore more developer utilities tools

100% in-browserNo downloadsNo sign-upMalware-freeHow we keep this safe →

Found this useful?

The tools stay free thanks to readers who chip in or spread the word.

Buy Me a Coffee