Claude Code
com o Claudinho
O Claude no terminal: o que o Vagner usa nos vídeos.
Extract skill
Extrai componentes, tokens de design e padrões repetidos para o design system do projeto
- instalações
- 53,2 mil
- estrelas no GitHub
- 87,9 mil
- No skills.sh desde
- março de 2026
- Licença
- Apache-2.0
Atualizada no GitHub em 25 de outubro de 2026. Dados conferidos em 26 de outubro de 2026, no skills.sh e no GitHub.
Nas palavras de quem fez
Extract and consolidate reusable components, design tokens, and patterns into your design system. Identifies opportunities for systematic reuse and enriches…
Segurança
Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.
- Gen Agent Trust HubPassou
- SocketPassou
- SnykPassou
Perguntas
Como instalar a Extract no Claude Code?
Toca em Levar, aqui nesta página, e deixa seu nome, e-mail e WhatsApp (é uma vez só). Aparece uma frase pronta: cola ela no Claude Code, que ele mesmo instala a Extract, e a skill passa a valer na próxima conversa. A mesma frase serve no Codex. Se preferir fazer na mão, o passo a passo está em como instalar skills no Claude Code.
Levar essa skill
1x extractR$ 0,00
TotalR$ 0,00
Levar precisa do JavaScript ligado. O código da skill está no GitHub: github.com/pbakaus/impeccable
Aprenda a usar
- Claude Design: como usar, até no plano grátis
O Claude Design cria tela de site, protótipo e slide conversando, e agora vem até no plano grátis. Veja onde abrir, como usar e como levar pro Claude Code.
Na mesma prateleira
Ver as 1.414 skills do corredorgreensock
gsap-
Seu site ganha seções que se mexem conforme a pessoa rola, ficam presas na tela ou correm pro lado, com o código no padrão oficial do GSAP.Auditada72 mil instalações, grátisscrolltrigger wshobson
tailwind-
As cores, os cantos e os componentes do seu site ficam definidos num lugar só, e o Claude faz as telas novas sempre no mesmo padrão.Auditada70,4 mil instalações, grátisdesign- system Google Labs
design-
As telas que você já desenhou no Stitch viram um DESIGN.md que faz as próximas telas saírem com a mesma cara.Oficial64,7 mil instalações, grátismd shadcn-
O Claude escolhe, instala e ajusta os componentes do shadcn/ui no seu projeto, com as cores da sua marca, modo escuro e acessibilidade.OficialAuditada53,4 mil instalações, grátisui alchaincyf
huashu-
Protótipo, apresentação ou vídeo em HTML com cara de estúdio de design, partindo de três caminhos visuais que você escolhe antes de tudo.50,3 mil instalações, grátisdesign nextlevelbuilder
ckm:
O Claude cuida da parte visual do negócio: logo, papelaria da marca, banners no tamanho de cada rede, ícones, apresentações e posts.32,5 mil instalações, grátisdesign GitHub
excalidraw-
O Claude transforma uma descrição em português num arquivo .excalidraw com caixas, setas e cores, pronto pra abrir e ajustar no Excalidraw.OficialAuditada31,7 mil instalações, grátisdiagram- generator stitch-
Você descreve a tela do seu jeito e o Claude pede ao Stitch uma versão caprichada, coerente com o resto do projeto, e baixa o HTML e a imagem.Oficial25,1 mil instalações, grátisdesign
Mais da loja pbakaus
Ver a loja pbakauspbakaus
impeccable
Você pede uma landing page, um painel ou um ajuste e recebe a tela pronta, com ponto de vista de design e conferida nos tamanhos de tela em que vai ao ar.360,7 mil instalações, grátispolish
Faz o acabamento final da interface: alinhamento, espaçamento, consistência e detalhesAuditada85,2 mil instalações, grátiscritique
Avalia um design pela ótica de UX: hierarquia visual, arquitetura da informação e carga cognitiva82,6 mil instalações, grátisaudit
Audita acessibilidade, performance, temas e responsividade e entrega relatório por prioridadeAuditada81,9 mil instalações, grátisadapt
Adapta designs a outros tamanhos de tela, dispositivos e plataformas, com breakpoints e toqueAuditada81,7 mil instalações, grátisanimate
Acrescenta animações e microinterações com propósito a uma tela para melhorar a usabilidadeAuditada81,7 mil instalações, grátisclarify
Melhora textos confusos de interface: mensagens de erro, rótulos, botões e instruçõesAuditada81,2 mil instalações, grátisoptimize
Acha e corrige lentidão na interface: carregamento, renderização, animações, imagens e bundleAuditada81,1 mil instalações, grátiscolorize
Põe cor com critério em interfaces monocromáticas, mantendo hierarquia e acessibilidadeAuditada80,9 mil instalações, grátisbolder
Deixa designs seguros demais mais ousados, com impacto visual sem perder a usabilidadeAuditada80 mil instalações, grátisdelight
Acrescenta personalidade e pequenos momentos de encanto que deixam a interface memorávelAuditada79,8 mil instalações, grátisdistill
Simplifica designs tirando a complexidade desnecessária e deixando só o essencialAuditada79,5 mil instalações, grátis