We are currently working on the next version of the DevTools - stay tuned!
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.
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.
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