Extrator de DESIGN.md

About

O DESIGN.md Extrator inspeciona qualquer página web e captura automaticamente os design tokens visíveis — cores, tipografia, espaçamentos, bordas e sombras — gerando um arquivo DESIGN.md estruturado no formato W3C Design Tokens Community Group (DTCG).

✦ COMO FUNCIONA

1. Abra o Painel Lateral da extensão em qualquer aba.
2. Clique em "Extrair esta página" — a análise leva menos de 5 segundos.
3. Navegue para outras páginas do mesmo site e extraia quantas quiser.
4. Clique em "Exportar" para baixar o DESIGN.md final.

O arquivo gerado já inclui um Prompt de Consolidação pronto para colar no Claude Code, Cursor ou qualquer LLM — ele pede ao modelo que una os tokens das várias páginas e produza um design system limpo e nomeado semanticamente.

✦ O QUE É EXTRAÍDO

• Cores
• Tipografia
• Espaçamentos
• Bordas
• Sombras

✦ FORMATO DE SAÍDA

O DESIGN.md segue a estrutura W3C DTCG com frontmatter YAML (para uso programático), uma seção por página capturada e o Prompt de Consolidação ao final. O formato é lido diretamente por agentes de IA e por ferramentas como Style Dictionary.

✦ PRIVACIDADE

A extensão não coleta, transmite nem armazena nenhum dado fora do seu navegador. Todo processamento ocorre localmente. Nenhuma conta, nenhum login, nenhuma telemetria.

Criada pelo ibe.IA — Instituto Brasileiro de Educação em Inteligência Artificial — e disponibilizada gratuitamente. Saiba mais em ibe.ia.br.