Detect CSS framework

How to detect Tailwind CSS on any website

Utility-first CSS framework — the dominant CSS layer for React/Vue/Svelte apps.

What is Tailwind CSS?

Tailwind CSS generates a lot of short utility classes (`flex`, `gap-3`, `text-sm`, `md:grid-cols-2`) that make production HTML class attributes distinctive. Version 4 introduced CSS-variable-driven themes and a new compilation pipeline.

Tailwind's utility-first approach dismantled the 'name every style' orthodoxy of classic CSS. Instead of `.card { ... }` in a stylesheet, you compose `flex flex-col gap-3 rounded-xl border p-5` inline on the element. That's verbose in the HTML but eliminates most of the naming, ordering and specificity problems of traditional CSS. The cost is that production HTML becomes visually noisy — which is also what makes Tailwind unmistakable to detect. A typical Tailwind element has 10-20 utility classes stacked up with recognisable prefixes (`md:`, `lg:`, `dark:`, `hover:`, `focus:`). Tailwind v4 (2024-2025) was a major rewrite: CSS-variable-driven themes, a faster compiler, `@theme` blocks in compiled output. That makes v4 visually distinguishable from v3 in the generated CSS.

Why it matters to identify

Tailwind has become the default CSS layer for modern React/Vue/Svelte apps. Detecting it narrows the UI kit shortlist (shadcn/ui, Radix + Tailwind, DaisyUI, Flowbite) and helps you correlate the frontend choices.

A brief history of Tailwind CSS

Tailwind CSS was released by Adam Wathan in 2017. v1 (2019), v2 (2020), v3 (2021, JIT compiler by default), v4 (2024, complete rewrite with CSS-variable themes). Tailwind Labs, the company, offers Tailwind UI (paid component library), Headless UI (unstyled React components) and Tailwind CSS IntelliSense (VS Code extension).

Ecosystem and common pairings

Tailwind companions: shadcn/ui (copy-paste component library built on Radix UI and Tailwind), Headless UI (accessible unstyled React primitives from Tailwind Labs), Radix UI / Base UI (primitive unstyled components), Lucide (icon library, default in shadcn), class-variance-authority (CVA) and clsx (for conditional class composition).

Detection signals we look at

Each signal alone is rarely conclusive; the detector cross-references all of them and weights by confidence. You can reproduce any of these checks yourself in Chrome DevTools.

HTML source

class="[^"]*(?:\bflex\b|\bitems-center\b|\bpx-\d|\bmd:grid-cols-)

Distinctive utility class combinations that are effectively unique to Tailwind (and UnoCSS, when explicitly configured to match).

Sourcemap path

node_modules/tailwindcss/

Tailwind bundled, exact version in the package.json.

Script src URL

cdn.tailwindcss.com

CDN-loaded Tailwind (common on prototypes and docs sites).

Versioning

Version

Notable changes

1.0

Initial stable release, 2019.

2.0

Dark mode built-in; CSS variables.

3.0

JIT compiler by default; arbitrary values.

4.0

Full rewrite; CSS-variable themes; `@theme` blocks.

Sites commonly running Tailwind CSS

github.com (parts of)
openai.com
vercel.com

Often confused with

Tailwind CSS vs UnoCSS

UnoCSS supports a Tailwind-compatible preset and outputs similar utility classes. The difference is in the generated CSS: UnoCSS ships `@unocss` comments in the bundle.

Detect Tailwind CSS

See Tailwind CSS — with the exact version — on every site you visit.

Sourcemap Explorer runs these checks passively in the background. When the target library is bundled, you get the precise package.json-level version.

Install free on Chrome