![Preview of VisBug](https://addons.mozilla.org/user-media/addon_icons/2670/2670655-64.png?modified=fec9a072)
VisBug by argyleink
Open source browser design tools
You'll need Firefox to use this extension
Extension Metadata
Screenshots
![VisBug showing spacing around elements](https://addons.mozilla.org/user-media/previews/thumbs/246/246937.jpg?modified=1622136505)
![Hover and VisBug will tell you style information](https://addons.mozilla.org/user-media/previews/thumbs/246/246938.jpg?modified=1622136531)
![Hover and VisBug will tell you accessibility information](https://addons.mozilla.org/user-media/previews/thumbs/246/246939.jpg?modified=1622136556)
![Hover and see distance between elements for quick measuring and alignment verification](https://addons.mozilla.org/user-media/previews/thumbs/246/246940.jpg?modified=1622136578)
About this extension
Open source web design debug tools built with JavaScript: a FireBug for designers.
- Point, click & 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.
- Point, click & 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.
Rate your experience
Informazio gehiago
- Add-on Links
- Version
- 0.4.3
- Size
- 5,38 MB
- Last updated
- duela 2 hilabete (2024ko api. 25a)
- Related Categories
- Lizentzia
- Apache License 2.0
- Version History
Gehitu bildumara
Release notes for 0.4.3
Fixes issue when closing VisBug and elements would continue to highlight
More extensions by argyleink
- There are no ratings yet
- There are no ratings yet
- There are no ratings yet
- There are no ratings yet
- There are no ratings yet
- There are no ratings yet