Hi Product Hunt,
I'm excited to introduce my latest Chrome extension project, UI Inspector. It’s a tool designed for designers and developers who want a straightforward, Figma-like interface for editing web elements right in the browser. With UI Inspector, you can quickly test updated styles on the fly, experiment with UI adjustments, or debug elements—all without diving into the complexity of DevTools.
This extension aims to simplify the process of making quick edits to elements, offering an easy, intuitive way to make changes as you work. Your feedback would be valuable as I continue improving UI Inspector to meet the needs of users like you.
There’s also a PRO version, which unlocks features like preset support, bulk updates for multiple elements at once, and exporting options to PNG or GitHub issues. Thanks for checking it out, and I look forward to hearing your thoughts!
I knew the UI looked familiar! You are the guy who also made the amazing Screen Ruler extension, definitely going to try this out too, your work is amazing
This sounds like a game changer, Im totally adding this one to my “must try” list. Congrats on your launch! 🎉
As a designer who's spent hours in Chrome dev tools... this is gold! Can it handle those tricky hover/focus states? Been going crazy trying to debug a complex dropdown menu with multiple state changes.
This is a great tool for me. I want to skip the problem of constant back and forth between code and the browser Very efficient.
Congrats on the launch! UI Inspector looks like a game-changer for front-end devs. How do you see it fitting into the design workflow?
Congratulations on the launch 🎉️
Glad you made this. Much needed improvement on Google's default dev console for making UI changes for testing.
This looks interesting. Congrats on the launch 🚀
We would certainly buy if you produce something that's better / faster to use than dev inspector for modifying web elements within the dev workflow. We previously bought CSS Pro and found it to be unuseful in practice (too slow, distracting UI, poor export).
Some questions for you:
1. Is there any option to copy/export the CSS changes you've made as text? You mention PNG output; this isn't useful to our developers.
2. Do you have any shortcut to open UI Inspector with one action? This was an issue with CSS Pro. We found that requiring multiple clicks to inspect an element to be an obstacle. The alternative here is the inbuilt DevTools, where one just right clicks once. This speed-to-use might sound small, but it isn't.
I'd also be happy to chat to provide additional comments directly if desired.
It's a really useful extension. Great job! I’d like to share a few ideas for improvements. How can I share them with you?
About UI Inspector for Google Chrome on Product Hunt
“Edit web pages like Figma”
UI Inspector for Google Chrome launched on Product Hunt on November 18th, 2024 and earned 191 upvotes and 12 comments, placing #11 on the daily leaderboard. Inspect and visually edit elements directly on the page for faster design and UI debugging.
UI Inspector for Google Chrome was featured in Browser Extensions (5.3k followers), Chrome Extensions (52.6k followers) and User Experience (364.7k followers) on Product Hunt. Together, these topics include over 43.9k products, making this a competitive space to launch in.
Who hunted UI Inspector for Google Chrome?
UI Inspector for Google Chrome was hunted by Myster Violets. A “hunter” on Product Hunt is the community member who submits a product to the platform — uploading the images, the link, and tagging the makers behind it. Hunters typically write the first comment explaining why a product is worth attention, and their followers are notified the moment they post. Around 79% of featured launches on Product Hunt are self-hunted by their makers, but a well-known hunter still acts as a signal of quality to the rest of the community. See the full all-time top hunters leaderboard to discover who is shaping the Product Hunt ecosystem.
Want to see how UI Inspector for Google Chrome stacked up against nearby launches in real time? Check out the live launch dashboard for upvote speed charts, proximity comparisons, and more analytics.
Myster Violets