Supertweak

Build and Ship with Tailwind Even Faster

Supertweak is a chrome extension that let's you Inspect, Tweak and Copy Tailwind styles right inside your browser.

Rapidly iterate without touching code

Supertweak let's you try out changes without wading through code or fiddling with devtools. Avoid context-switching, tweak until you find what hits home and copy back the generated classes or html to your editor.

Custom config suport

You can use your own config in the Play CDN supported format.

[ .. ]

Arbitrary values

You can enter arbitrary values like mt-[10px] or variants like [&>*]:hover

One click copy

Easily copy the classes or html content of the selected element

Quick Info

Hovering over any element shows the dimensions and font details

Tweak color opacity

Supertweak supports editing opacity of color properties

!-

Modifier support

You can use Negative and Important modifiers on supported properties

With Some Nifty Additions

Quickly try out different copy ✒️

Edit mode enables you to conveniently focus on just editing the text in the page with a single click.

Preview and edit in responsive widths 📱

Unlike the responsive mode in the devtools, Supertweak let's you resize the browser window itself to device widths - enabling you to use the editor in smaller screens.

Capture your changes for quick feedback 📷

You can capture the screenshot of the visible screen or a selected area for sharing your changes with your teammates or client and getting feedback.

Discover a delightful way to build memorable websites 💜

With Supertweak, even being lazy and just messing around can lead to many happy accidents. Take it for a spin and see it for yourself 👇


Try it free for 7 days - no details required

Questions

Does Supertweak work on all websites?

It should work on any website that chrome extensions are allowed to run on, regardless of Tailwind usage. Supertweak rely on Tailwind Play CDN to generate the classes.

Does it work offline?

Network is needed when you install the extension and use it for the first time. Once Play CDN version of Tailwind is loaded and cached, you can use it offline.

What browsers does it support?

It is tested only in Chrome, but it should work on any chromium based browsers. i.e Brave,Edge & Arc

Does it update the website code automatically?

Nope. Supertweak only lets you tweak the design in the browser. You'll need to copy the classes or the html and paste them in your editor to make the changes permanent.

How are tailwind styles generated?

Supertweak is loading Tailwind (v3.2.1) from the official CDN to generate styles and handle the custom config.

What versions of Chrome does this support?

It is tested in Chrome 98.xx and Chrome 107.xx. But it should work from Chrome 88+ If you encounter any issues, please contact support

I have another question

Your questions are most welcome. Please send a mail at support@supertweak.dev