u/Acrobatic-Dig-1628

I’ve been hacking on a Chrome extension for “new age” frontend devs and finally have something demo‑able, so sharing a first look and would love honest feedback.

The idea: instead of digging through Chrome DevTools and a thousand nested divs, you get an inspect tool and a visual editor that feel closer to Figma, but directly on the live page. You click an element, see its Tailwind classes and key properties, tweak them visually, and the page updates in place.

In the short video I’m sharing here, I’m only showing two pieces:

• Inspecting elements with a simpler, Tailwind‑aware inspector
• A visual editor where you can tweak layout, spacing, typography etc. like you would in a design tool

There’s also a “V” key toggle that lets you flip between the original page and your edited version instantly, so you can compare changes live without refreshing or touching the code.

Under the hood I’ve already sketched out more stuff (page overview, asset extraction, accessibility checks, tokens, export/hand‑off, etc.), but I’m deliberately not over‑building yet. Right now I mostly want to validate whether the core inspect + visual editing flow is actually useful in your day‑to‑day.

I’m very aware this is rough and probably has blind spots. I’m not sure:

• If this really saves time vs DevTools for you
• Where the UX feels confusing or “too much magic”
• Which 1–2 things you’d need for this to become something you’d install and actually keep

If you’re a frontend dev / Tailwind user / designer‑dev hybrid and are willing to be a pilot user, I’d love to get you early access, watch how you use it, and hear what sucks.

What I’d love from you in the comments:

• Would you personally use a tool like this? Why / why not?
• What’s the most annoying part of your current inspect → tweak → ship loop?
• If you could only add one feature to this, what would it be?

Happy to share more behind‑the‑scenes, roadmap, or even some ugly WIP UI if people are interested.

I’ve been hacking on a Chrome extension for “new age” frontend devs and finally have something demo‑able, so sharing a first look and would love honest feedback.

The idea: instead of digging through Chrome DevTools and a thousand nested divs, you get an inspect tool and a visual editor that feel closer to Figma, but directly on the live page. You click an element, see its Tailwind classes and key properties, tweak them visually, and the page updates in place.

In the short video I’m sharing here, I’m only showing two pieces:

• Inspecting elements with a simpler, Tailwind‑aware inspector
• A visual editor where you can tweak layout, spacing, typography etc. like you would in a design tool

There’s also a “V” key toggle that lets you flip between the original page and your edited version instantly, so you can compare changes live without refreshing or touching the code.

Under the hood I’ve already sketched out more stuff (page overview, asset extraction, accessibility checks, tokens, export/hand‑off, etc.), but I’m deliberately not over‑building yet. Right now I mostly want to validate whether the core inspect + visual editing flow is actually useful in your day‑to‑day.

I’m very aware this is rough and probably has blind spots. I’m not sure:

• If this really saves time vs DevTools for you
• Where the UX feels confusing or “too much magic”
• Which 1–2 things you’d need for this to become something you’d install and actually keep

If you’re a frontend dev / Tailwind user / designer‑dev hybrid and are willing to be a pilot user, I’d love to get you early access, watch how you use it, and hear what sucks.

What I’d love from you in the comments:

• Would you personally use a tool like this? Why / why not?
• What’s the most annoying part of your current inspect → tweak → ship loop?
• If you could only add one feature to this, what would it be?

Happy to share more behind‑the‑scenes, roadmap, or even some ugly WIP UI if people are interested.