InspectMark

Observa edições visuais (CSS+HTML) do DevTools e gera um diff pronto pra colar numa LLM. Injeta só na aba ativa.

O DevTools do Chrome é o melhor editor visual que existe: você mexe no CSS, arrasta valores, testa cores e vê o resultado na hora. O problema é depois. Voltar pro código e reproduzir tudo na mão é chato e dá erro. O InspectMark resolve isso. Você edita à vontade no DevTools nativo, e a extensão observa as mudanças (propriedades de CSS e alterações de HTML) e monta um diff único, com contexto e âncoras, pronto pra colar numa LLM aplicar direto no código-fonte. Não é mais um editor. O DevTools continua sendo o editor. O InspectMark é o observador que traduz o que você fez em instruções que a IA entende. Como funciona 1. Clique no ícone pra armar (ele tira uma "baseline" da página). 2. Edite o que quiser no DevTools: CSS, cores, espaçamento, HTML. 3. Clique de novo. O InspectMark mostra um diff limpo do que mudou. 4. Copie e cole na sua LLM favorita. Pronto. O que faz dele diferente - Filtros de ruído inteligentes: páginas vivas (carrosséis, contadores, animações) não afogam a sua edição real. Ele mostra o que você mudou, não o que a página faz sozinha. - Modo Escopo: aponte a região que você está editando e o resto vira silêncio. - Modo Anotar: rabisque por cima da tela (setas, caixas, destaques) e capture um PNG pra explicar visualmente o que quer. - Âncoras pro código: cada mudança vem com pistas (seletor, caminho, e arquivo:linha quando há sourcemap) pra a IA achar o lugar certo. - Privacidade total: nada sai do seu computador. Sem telemetria, sem servidores, sem coleta. Feito pra quem desenha no navegador e programa no editor.