DEV Community

Ayman Abdi Mohamed
Ayman Abdi Mohamed

Posted on

I Built a Tailwind CSS Bloat Scanner — Here's What I Found in My Own Code

The problem nobody talks about

I was refactoring a client project last week and realized something uncomfortable: I had 47 arbitrary values scattered across my components. Things like w-[312px], bg-[#fdfdfd], text-[14px], mt-[12px] — hardcoded values that should have been theme tokens from the start.

Every one of those generates a unique CSS rule in production. They don't get deduplicated. They don't benefit from Tailwind's design system. They just silently bloat your bundle.

So I built a tool to catch them automatically.

What TailwindTrimmer does

You paste your JSX, TSX, or HTML into the scanner. It:

  1. Extracts every Tailwind class from your className and class attributes
  2. Flags arbitrary bracket values that should be theme tokens
  3. Scores your overall CSS health (0-100%)
  4. Recommends specific replacements — not vague advice, actual class swaps like "replace w-[312px] with w-80"

The whole thing runs in under a second.

What I found in my own code

I pasted one of my dashboard components and scored 38%. Five arbitrary values flagged in a single component. The tool caught things I'd been visually skipping for weeks:

  • w-[312px] → should be w-80 (320px, close enough and on-scale)
  • bg-[#fdfdfd] → should be bg-white or bg-neutral-50
  • text-[14px] → should be text-sm
  • text-[#111111] → should be text-gray-900
  • mt-[12px] → should be mt-3

None of these were intentional design decisions. They were lazy one-off values from moving fast.

The stack (for the curious)

  • Backend: FastAPI with regex-based class extraction and scoring
  • Frontend: React + TypeScript + Tailwind v4 (yes, it eats its own dog food)
  • Hosting: Ubuntu VPS with Nginx reverse proxy

No AI, no LLM calls, no external APIs. Pure parsing. That's why it's fast.

Try it

2 free scans, no signup required:

https://tailwindtrimmer.veltro.co.ke

$16 for unlimited if you find it useful.

I'm actively building this out — next up is duplicate class detection and file upload support. What other checks would save you time? Let me know in the comments.

Top comments (0)