CRX id
cdockenadnadldjbbgcallicgledbeoc
cdockenadnadldjbbgcallicgledbeoc
Description from extension meta
Open source browser design tools
Image from store
Description from store
Open source web design debug tools built with JavaScript: a FireBug for designers.
- Point, click, move, resize & tinker
- Edit or style any page, in any state, like it's an artboard
- Inspect styles, spacing, distance, accessibility and alignment
- Nitpick layouts & content, in the real end environment, at any device size
- Leverage adobe/sketch skills
- Edit text, replace images
- Design within the chaos: use production or prototypes and the odd states they produce, as artboards and design opportunities
- Design while DevTools simulates latency, i18n, media queries, platform constraints, CPUs, screensize, etc
- Make more decisions on the front end of your site/app (a11y, responsive, edge cases, etc)
- No waiting for developers to expose their legos, just go direct and edit the end state (regardless of framework) and execute/test an idea
Give power to designers & content creators, in a place where they currently feel they have little to none, **by bringing design tool interactions and hotkeys to the browser**
Latest reviews
- (2023-07-25) Mirta Tula: Exactly what I needed for work! Thanks!
- (2023-06-01) Andrés Andrade: What a beautiful and useful tool, love it!
- (2023-03-31) Default Cube: nice extension
- (2023-03-30) Moutasem Abdullatif: amazing
- (2023-03-22) Профупаковка Google Analytics: Супер инструмент!
- (2023-03-18) Fi Br: Essencial para desenvolvedores de websites.
- (2022-12-27) Henry Moran: amazing tool and makes doing QA a whole lot easier. pair this with the Jam extension to create bug tickets and you're workflow will improve exponentially.
- (2022-12-19) dg chen: Greate plugin for UI designer and web developer.
- (2022-12-12) Molly: Seems really cool for what it is: a way to visually change a webpage using mainly keyboard commands. What it doesn't do is save your changes in any meaningful way: it'll be up to you to take a screenshot or find your code changes in either Chrome's built-in developer tools or another extension. The second thing it doesn't do super well is onboarding. There's a "training" mode to learn the key commands that's kind of nifty, but at first I couldn't figure out how to close it without refreshing the page and losing my changes. (Answer: I think Esc or just hitting the VisBug extension icon will do it.) Check out the master list of key commands https://github.com/GoogleChromeLabs/ProjectVisBug/wiki/Keyboard-Master-List , and then the wiki pages, which include training videos: https://github.com/GoogleChromeLabs/ProjectVisBug. But I felt like I was missing things, e.g. I discovered a /skeleton command in the search bar by accident that produces a wireframe, and then found other commands with the down arrow next to the search icon, but couldn't figure out how to un-apply those styles. I also couldn't quickly figure out when/what the newest updates were to see if/when save changes is coming. (Not suuuper familiar with GitHub, which I think is the target audience here.) I'm looking for something that can help me save my changes as code, so I'll be moving on. But I hope this continues to develop, since keyboard accessibility is soooo overlooked and under-supported. Tons of cool web projects only exist because the internet was allowed to become a Petri dish for spontaneous creativity and collaboration; imagine how much untapped potential, creativity, and new projects we'd have access to if an entire group of contributers weren't effectively locked out of using most of the web since its early days?
- (2022-11-18) Trần Huy Hoàng: nice
- (2022-11-12) Đình Bình: ok đó em trai của ta hehehhehêhê ta mới code thiui t 6 tủi
- (2022-10-14) Zheng Lai: Incredible functionality and intuitive interface.
- (2022-10-14) Ken Alvarez: Amazingly and intuitive. Best in-class! Thank you!
- (2022-09-27) aLEKS: make changes save
- (2022-08-11) Touda zou: Indispensable !
- (2022-07-13) Ferran Buireu: No sabes que la necesitas hasta que la pruebas. Permite reordenar y cambiar todo el DOM en unos simples clicks. Super bonita y fácil de usar por la complejidad que tiene.
- (2022-06-29) Eduardo Sánchez Alvarado: The ruler alone is a life saver, but every single feature is incredibly helpful and a complete game changer for designing on the Web. The ability to preview styles by hovering over the element rather than digging through the chrome dev tools, or to modify the alignment and placement on the fly, again without digging through and tinkering with the clunk dev tools, is mind blowing.
- (2022-04-17) Ramy Hasan: awesome tool and thank you
- (2022-04-04) XeiDaMoKa !: why not be able to save the changes locally so it stays the same after refresh ?
- (2022-03-23) danial: best tool for frontend developers
- (2022-01-28) Codrin Iftode: This is absolutely amazing, cool, and very useful! Thank you for developing this.
- (2022-01-25) Drlsxs Lupez: 宝藏插件
- (2022-01-21) Вячеслав Быков: Очень полезно! Very useful!
- (2022-01-08) alaska Canyon: best tool
- (2021-12-27) Artem Hryhorov: Very useful extension, thanks!
- (2021-12-27) ZY Y: 对于设计师实在是太有用了，走查超级超级方便
- (2021-12-02) Kurt Luo: Excellent， and it helped a lot!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
- (2021-11-30) Lou Briccant: Don't work. When i click show/hide nothing happens.
- (2021-11-23) pu po: 太棒了，解决了我很多麻烦
- (2021-07-31) Dương Vinh: Good extension 💯💯💯💯
- (2021-07-05) コ浦ちUnknown: Excelente
- (2021-06-11) Estifanos Wendimu: An incredibly useful extension. But i find it supremely annoying that you are not allowed to copy the hex of colors picked.
- (2021-06-04) Tanmay Dwivedi: This tool is very close to make it such that u can change the path size (width and height) so that one can easily imagine the WYSIWYG.
- (2021-06-02) kocmedikal onur: Perfect
- (2021-04-28) Ilya Azin: Awesome tool!)
- (2021-04-06) עמר מנחם: Great!
- (2021-04-04) danielpancake: Amazing
- (2020-12-23) Eugen Tudorancea: Very useful and easy to use to test some design modifications without touching the code.
- (2020-11-29) 池彬: 赞！！实时的调试线上web效果，无论是位置还是间距。 并且预设了很多快捷键，是一个高效的工具。
- (2020-11-28) Abhi Harshe: This is an vey helpful tool that makes designing way much easier for elements and CSS directly to edit on website itself.
- (2020-11-24) Camilo Álvarez: Excelente extensión. Recomendada.
- (2020-11-17) Ten Zen: Probably the most useful dev extension I have ever used!
- (2020-11-09) Emrah ATILKAN: It is really cool for basic things. But needs lots of features. I would like to learn all font attributes.
- (2020-11-05) Tushar Sarkar: Just the thing i needed Thanks a lot
- (2020-11-04) Julie Ringelmann: Really great little tool! I am in-love with it, just wish I could reposition it so that I could screenshot stuff otherwise behind the floating toolbar. .
- (2020-09-30) 한동훈신동중 1-4 30: Perfect extension for web devs
- (2020-09-24) stdio: Very good plugin for front devs.
- (2020-09-18) the d4: This gives you the codes after changing position with mouse 5Stars!!
- (2020-08-25) That Other Guy: Every developer should have this, makes life so much easier.
- (2020-07-23) Sapinder Singh: I'M LOVIN'IT!!!