VisBug

Open source browser design tools

O que é VisBug?

VisBug é uma extensão do Chrome desenvolvida por https://visbug.web.app, e sua principal característica é "Open source browser design tools".

Capturas de Tela da Extensão

screenshot

Baixar o arquivo CRX da Extensão VisBug

Baixe arquivos de extensão VisBug no formato crx, instale manualmente as extensões do Chrome no navegador ou compartilhe os arquivos crx com amigos para instalar facilmente as extensões do Chrome.

Instruções de Uso da Extensão

                        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**                    

Informações Básicas da Extensão

Nome VisBug VisBug
ID cdockenadnadldjbbgcallicgledbeoc
URL Oficial https://chromewebstore.google.com/detail/visbug/cdockenadnadldjbbgcallicgledbeoc
Descrição Open source browser design tools
Tamanho do Arquivo 5.35 MB
Contagem de Instalações 187,716
Versão Atual 0.3.55
Última Atualização 2022-10-21
Data de Publicação 2020-06-26
Classificação 4.82/5 Total de 225 Avaliações
Desenvolvedor https://visbug.web.app
Email [email protected]
Tipo de Pagamento free
Site da Extensão https://github.com/GoogleChromeLabs/ProjectVisBug
URL da Página de Ajuda https://github.com/GoogleChromeLabs/ProjectVisBug/issues
Idiomas Suportados en
manifest.json
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "name": "VisBug",
    "version": "0.3.55",
    "description": "Open source browser design tools",
    "manifest_version": 2,
    "icons": {
        "128": "icons\/visbug.png"
    },
    "permissions": [
        "activeTab",
        "contextMenus",
        "storage"
    ],
    "background": {
        "persistent": true,
        "scripts": [
            "visbug.js",
            "contextmenu\/launcher.js",
            "contextmenu\/colormode.js",
            "contextmenu\/colorscheme.js"
        ]
    },
    "browser_action": {
        "default_title": "Click or press Alt+Shift+D to launch VisBug",
        "default_icon": {
            "128": "icons\/visbug.png"
        }
    },
    "web_accessible_resources": [
        "tuts\/*",
        "toolbar\/*"
    ],
    "commands": {
        "_execute_browser_action": {
            "suggested_key": {
                "windows": "Alt+Shift+D",
                "mac": "Alt+Shift+D",
                "chromeos": "Alt+Shift+D",
                "linux": "Alt+Shift+D"
            }
        }
    }
}