Communitygithub.com

arvindrk/extract-design-system

Extrai tokens de design (cores, tipografia, espaçamento, raio de borda, sombras) de qualquer site público. Gera JSON e propriedades CSS customizadas para projetos locais. Disponível como skill de agente de IA (Claude, Cursor, Codex) e CLI independente.

O que é extract-design-system?

Esta skill permite que agentes de IA (como Claude, Cursor e Codex) e desenvolvedores extraiam automaticamente tokens de design de qualquer site público. Ela identifica e organiza cores, tipografia, espaçamento, raios de borda e sombras diretamente do CSS do site alvo. O resultado é gerado como um arquivo JSON estruturado e propriedades customizadas CSS, prontos para serem usados em projetos locais ou sistemas de design. A skill elimina o trabalho manual de inspeção de estilos, acelerando a criação de protótipos ou a padronização de design systems. Também oferece uma versão CLI que pode ser executada de forma independente, fora do contexto de agentes de IA.

Funciona com✓Claude Code✓Codex CLI✓Cursor
npx skills add arvindrk/extract-design-system

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que extract-design-system faz?

Extrai tokens de design (cores, tipografia, espaçamento, raio de borda, sombras) de qualquer site público. Gera JSON e propriedades CSS customizadas para projetos locais. Disponível como skill de agente de IA (Claude, Cursor, Codex) e CLI independente.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

Habilidades Relacionadas