Logo of DevTools for Tailwind

DevTools for Tailwind

The DevTools Tailwind deserves

Tailwind builds are really small by purging all classes that the design doesn't need. That's great but means that you can't tinker around with the design directly in the browser. We fixed that – without changing your site.

See pricing
You can test the DevTools for Tailwind on this website in your Desktop browser ⛵️.
DevTools for Tailwind

Tailwind's JIT mode is awesome…

…but it makes designing and debugging in your browser hard!

The DevTools for Tailwind CSS bring back designing and debugging in your browser. You can use the full power of the JIT engine and even add classes like border-[30px] on sites that use production builds.

Start debugging

Debug your Tailwind sites in the browser with the full power of the JIT engine and with Intellisense autocompletition. This is a new era of browser debugging and it feels like you are in your IDE.

Intellisense autocompletion

The DevTools for Tailwind chrome extension brings full support for Intellisense autocompletion. Get any variant and class suggestion as you type and retrieve class and color information on hover.

Full JIT engine support

Add any variant combination to your website straight from the DevTools for Tailwind browser extension. This also allows you to make use of JIT-only features, such as arbitrary attribute values and pseudo element variants.

Custom config support

Are you using a custom Tailwind configuration to extend the default theme with custom fonts, colors, spacing and more? No problem – just paste your Tailwind CSS config into the DevTools for Tailwind extension and you're ready to go!

Easily see your changes

The built-in "diff" mode allows you to immediately see the Tailwind class changes that you made. Making multiple changes inside your browser no longer requires you to gather together all the changes that you made. Everything's at one point.

Get the DevTools for Tailwind CSS

Purchase the DevTools or level up your browser experience with the Tailwind bundle.

Plans

DevTools for Tailwind

$49

$29

Buy

Features

  • Available for Google Chrome and Chromium based browsers (Brave, Edge, etc.)
  • One-time purchase
  • Money-back guarantee

Bundle up with windy

Level up your Tailwind game with Windy and transform any HTML element from any website into a Tailwind CSS component.

Logo of Windy
+
Logo of DevTools for Tailwind

Features

  • Available for Google Chrome and Chromium based browsers (Brave, Edge, etc.)
  • One-time purchase
  • Money-back guarantee

Local taxes or VAT may apply during the checkout.

No free trial, no risk
Get the DevTools and try it for up to 14 days. Email us if you are not happy and we'll give you a refund. No hard feelings. No risk. No-brainer.
Take one for the team
Want your whole team to get the benefits of the DevTools? Contact [email protected] and we’ll set you up with a team license.
Where you want it
Use the DevTools on two separate devices or browsers and switch an ‘activation’ at any time to use it elsewhere.

Beyond Code GmbH, An der Lingenmühle 10, 41061 Mönchengladbach, Germany
VAT ID: DE315110518 / Managing Partners: Marcel Pociot, Sebastian Schlein
Commercial Register: Amtsgericht Krefeld, HRB 16540