// skills embutidas · 03
claude-design
Cria artefatos HTML one-off com design profissional: landing, protótipo, mockup, board visual ou deck, sem depender de uma UI hospedada.
Metadata
params source bundled Instalada por padrão no repositório Okami-Agent. path file skills/claude-design/SKILL.md triggers keywords design, landing, protótipo, mockup, deck, slide, visual, hero, dashboard, html loaded by tool use_skill carrega o corpo completo quando a tarefa casa com a skill.
Quando usar
- Precisa de artefato HTML autônomo.
- Exploração visual, landing ou protótipo rápido.
- Há brand docs, screenshots ou tokens para guiar o visual.
Quando não usar
- App real com contrato ShadCN/HeroUI.
- Mudança de produto que precisa integrar no código existente.
- Design sem contexto de marca ou objetivo.
Fluxo recomendado
- Leia brand docs, repo, design tokens e screenshots.
- Escolha tipografia, cor, layout e movimento com propósito.
- Construa o HTML/CSS/JS autônomo.
- Abra no browser e verifique sintaxe, contraste e ausência de anti-padrões.
Regras
- Sem gradiente agressivo, glassmorphism gratuito, stock genérico ou dashboard falso.
- Compreensão vem antes de decoração.
- Respeite
prefers-reduced-motion.
Checklist de conclusão
- Arquivo abre no browser.
- Texto importante tem contraste aceitável.
- Não há anti-padrões listados na skill.