Finds Tailwind CSS v3 syntax that v4 removed or silently redefined - @tailwind directives, bg-opacity-*, outline-none, bare border and ring - with the v4 replacement and a line number. Runs entirely in your browser — nothing is uploaded.
Same engine as the VS Code extension, byte for byte.
Free for the file open in your editor - no key, no limit. The workspace sweep and the report ask for a key.
npmMCP server (npx)Docker Hubnpx @readystack/tailwind-v4-upgrade-blocker-lint <file> npx @readystack/tailwind-v4-upgrade-blocker-lint --mcp docker run --rm -v "$PWD:/w" getreadystack/tailwind-v4-upgrade-blocker-lint /w
Team? One key for every ReadyStack linter, 5 seats, $149 once
Scan every file in the workspace in one command and write a dated Markdown migration report with a per-file count you can hand to your team
One payment, one licence key for this tool. The key is shown right after payment.
A front-end contractor sweeping the same codebase by hand bills 60-120 an hour.
Buy the full version — $29· ReadyStack
Real numbers from this tool, line by line.
35 findings on a 73-line file, from 19 rules - that is what a front-end contractor migrating an agency's Tailwind v3 marketing site gets back on the first scan. The same file, after the migration, returns 0. The gap between those two numbers is the part of a Tailwind v4 upgrade that nothing in your pipeline goes red about.
Tailwind 4 replaced Tailwind 3 on 2025-01-22. The official path is npx @tailwindcss/upgrade, and it is good at what it does: it renames the utilities that were renamed. flex-shrink-0 becomes shrink-0, overflow-ellipsis becomes text-ellipsis, bg-gradient-to-r becomes bg-linear-to-r. Those are the easy ones, - a missed one produces no CSS at all, and you see it immediately.
The expensive ones are the opposite. They still compile.
Write class="border" in v4 and you get a border - painted in currentColor, where v3 painted gray-200. The border does not vanish; it takes the colour of the text next to it. Write class="ring" and you get a ring - 1px instead of 3px, currentColor instead of blue-500. shadow-sm, rounded-sm, blur-sm and drop-shadow-sm all still resolve, one step larger than they did in v3, because the whole scale shifted and the old -sm look is now -xs. outline-none still applies, except it now means outline-style: none, so the focus ring that used to survive forced-colors mode is gone. And stacked variants changed direction: first:*:pt-0 was valid v3 and in v4 it reads left to right and matches nothing at all.
Five real regressions, zero build errors. They get found by eye, in review, and often by the client.
There is a second reason this list matters in 2026. Every language model trained before January 2025 writes Tailwind v3 by default. Ask one for a pricing card and it hands you @tailwind base, bg-opacity-90, flex-shrink-0, bg-gradient-to-r - in a file dated today, pasted into a v4 project. The upgrade tool ran months ago. Nobody runs it again on a component that was written after it.
This extension is that second pass. It reads the file you have open - .css, .html, .jsx, .tsx, .vue, .svelte - and reports every one of the 19 rules it breaks, with the line number and the v4 replacement on the same line. Nine of the rules cover constructs v4 removed outright. Six cover the ones it silently redefined. Four cover configuration: a tailwind.config.js that v4 will not read without a @config line, custom utilities left inside @layer utilities where v4 no longer registers them, @apply in a component <style> block with no @reference above it, and the deprecated dot-path theme(colors.slate.700) lookup.
The bundled fixtures are the proof. _fixtures/dirty.html is a 73-line pricing card written the way a v3-trained model writes it; every one of the 19 rules fires on it, for 35 findings. _fixtures/clean.html is the same card migrated; it returns 0. The same engine file runs in the editor and in the browser, so the web page and the extension cannot disagree about a rule.
Scanning one file is free and finishes that file - all 19 rules, every line number, no key and no account. The licence key changes axis rather than depth: one command scans every file in the workspace and writes a dated Markdown migration report with a per-file count, the artefact you hand to a team or attach to a client invoice.
A front-end contractor sweeping the same codebase by hand bills 60-120 an hour, and the silent cases are not a search - they are a visual diff of every component. That is the comparison worth making before the migration, not after it.
It reads the Tailwind file you have open and reports every construct that Tailwind v4 removed or silently redefined, with the line number and the v4 replacement. It ships 19 rules. On the bundled 73-line v3 fixture they raise 35 findings; on the migrated copy of the same file they raise 0.
Front-end developers and agency teams moving a Tailwind CSS v3 codebase to v4, and anyone reviewing Tailwind markup an AI wrote. Models trained before January 2025 still emit v3 syntax by default, so a freshly generated component can carry @tailwind directives and bg-opacity-* into a v4 build.
The upgrade tool rewrites the utilities it can rename and stops. It cannot see the silent cases, because they still compile: bare border now takes currentColor instead of gray-200, bare ring is 1px instead of 3px, shadow-sm is one step larger, and outline-none no longer keeps a focus ring.
Free: scan the file you have open and read every finding, all 19 rules, with line numbers and replacements. That finishes the file in front of you. The licence key adds scale and ownership: one command scans every file in the workspace and writes a dated Markdown migration report you can hand to your team.
A front-end contractor sweeping the same codebase by hand bills 60-120 an hour, and the silent cases need a visual diff of every component rather than a search. This extension is 29 dollars once, with one licence key per person or team seat and.
A general AI chat answers from training data with a cutoff date, cannot read your repository and names no rule version. Tailwind v4 Upgrade Blocker Lint checks the file you open against 19 rules from a rule set dated 2026-09-20, and points at the exact line with the fix. For a filing, an audit or a client you need that dated result on your own files.
One question, answered by the person who built it. Your email only if you want the answer sent.
Paste this code into your page. It runs in your visitor’s browser and stays up to date. Nothing your visitors type is stored.
For businesses: your name and logo instead of ours, and each visitor’s result + e-mail in your inbox (only when they tick consent) — Pro from $19/month. See Pro →