CommunityEscrita e Ediçãogithub.com

albertzhangz10/design-system-skill

Habilidade para Claude Code: Gere design.md, design-guidelines.md e design-components.md a partir de quaisquer referências de design — imagens, PDFs, links, capturas de tela. Para codificação assistida por IA (Cursor, Claude Code, Copilot).

O que é design-system-skill?

Esta habilidade para agentes de IA (como Claude Code, Cursor e Copilot) permite gerar automaticamente três arquivos de documentação de sistema de design a partir de referências visuais: 'design.md' (visão geral e princípios de design), 'design-guidelines.md' (diretrizes de uso e boas práticas) e 'design-components.md' (componentes e padrões). Ela aceita diversas entradas como imagens, PDFs, links e capturas de tela, extraindo informações visuais e textuais para criar uma documentação estruturada. É útil para desenvolvedores que desejam integrar sistemas de design existentes em projetos de codificação assistida por IA, garantindo consistência visual e referência rápida durante o desenvolvimento. A habilidade funciona processando as referências fornecidas e gerando markdown organizado, facilitando a adoção de guias de estilo e componentes de UI em fluxos de trabalho baseados em IA.

Funciona com✓Claude Code~Codex CLI✓Cursor
npx skills add albertzhangz10/design-system-skill

Installed? Explore more Escrita e Edição skills: steipete/notion, langchain-ai/langchain, bytedance/podcast-generation · View all 6 →

Perguntar na sua IA favorita

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

Documentação

O que design-system-skill faz?

Habilidade para Claude Code: Gere design.md, design-guidelines.md e design-components.md a partir de quaisquer referências de design — imagens, PDFs, links, capturas de tela. Para codificação assistida por IA (Cursor, Claude Code, Copilot).

Habilidades Relacionadas