Claude Code
com o Claudinho
O Claude no terminal: o que o Vagner usa nos vídeos.
Baseline UI skill
Valida durações de animação, escala tipográfica, acessibilidade e vícios de layout em projetos Tailwind CSS
- instalações
- 207
- estrelas no GitHub
- 5.864
- No skills.sh desde
- abril de 2026
- Licença
- MIT
Atualizada no GitHub em 29 de agosto de 2026. Dados conferidos em 26 de outubro de 2026, no GitHub.
Nas palavras de quem fez
Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when…
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 Baseline UI 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 Baseline UI, 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 baseline-uiR$ 0,00
TotalR$ 0,00
Levar precisa do JavaScript ligado. O código da skill está no GitHub: github.com/vercel-labs/open-agents
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 corredorwearescientist
awesome-
O Claude escolhe o estilo de uma marca grande que combina com o seu produto e redesenha as telas com as cores, fontes e espaçamentos dela.Auditada658 instalações, grátisdesign- md prowler-cloud
tailwind-
O Claude estiliza seus componentes com as classes do Tailwind e do tema, sem cor solta no meio do código, e o visual fica fácil de manter.Auditada612 instalações, grátis4 dominikmartn
nothing-
O Claude desenha telas e painéis monocromáticos, guiados pela tipografia, com modo claro e escuro caprichados e nenhum enfeite sobrando.Auditada596 instalações, grátisdesign 199-biotechnologies
motion-
O Claude anima seu site com o Motion, sucessor do Framer Motion: entradas suaves, efeitos na rolagem e botões que respondem ao toque, sem travar.Auditada593 instalações, grátisdev- animations martinholovsky
webgl
O Claude escreve shaders e efeitos 3D no navegador que não derrubam a página: tratam a perda do contexto, limitam memória e têm plano B sem WebGL.Auditada555 instalações, grátismanutej
figma-
O Claude escreve plugins que fazem no Figma o trabalho repetitivo: montar o design system, criar variações de botão, exportar todas as telas em 1x e 2x.Auditada542 instalações, grátisdesign albermonte
material-
O Claude desenha ou revisa telas de app Android no Material 3 Expressive, com os tokens certos de cada componente e as checagens de acessibilidade.Auditada502 instalações, grátis3- expressive Vercel Labs
emil-
Telas que respondem do jeito certo: botão que reage ao clique, menu que abre rápido e animação só onde ela ajuda.OficialAuditada358 instalações, grátisdesign- eng
Mais da loja Vercel Labs
Ver a loja Vercel Labsfind-
Em vez de fazer tudo do zero, o Claude acha uma skill já testada pra tarefa, mostra de onde ela vem e instala com um comando.Oficial4 milhões de instalações, grátisskills agent-
O Claude abre o Chrome, navega, clica, preenche e testa o seu site sozinho, e você recebe os prints e os dados no fim.Oficial1,2 milhão de instalações, grátisbrowser vercel-
O agente escreve e revisa seu código React e Next.js seguindo 70 regras de desempenho da Vercel, das que mais pesam às de detalhe.OficialAuditada838,7 mil instalações, grátisreact- best- practices web-
Você aponta os arquivos do site e recebe a lista do que fere as boas práticas de interface, com o arquivo e a linha de cada problema.Oficial784,3 mil instalações, grátisdesign- guidelines vercel-
O Claude para de empilhar props como isEditing e isThread e monta componentes que se combinam, mais fáceis de manter por gente e por IA.OficialAuditada418,1 mil instalações, grátiscomposition- patterns vercel-
O Claude escreve e revisa seu app em React Native ou Expo seguindo regras que deixam lista, animação e navegação fluidas no celular.OficialAuditada254,5 mil instalações, grátisreact- native- skills deploy-
Você pede pra pôr o projeto no ar e recebe o link da Vercel; se o projeto tem Git, fica ligado pra cada push publicar de novo sozinho.Oficial169,7 mil instalações, grátisto- vercel vercel-
Cria animações nativas entre estados da interface com a View Transition API do ReactOficialAuditada167,6 mil instalações, grátisreact- view- transitions vercel-
Publica e gerencia projetos na Vercel pela CLI usando token de acesso, sem login interativoOficial135,8 mil instalações, grátiscli- with- tokens vercel-
O Claude lê as métricas de produção do seu projeto na Vercel e devolve recomendações em ordem pra baixar a conta e acelerar as rotas que pesam.OficialAuditada110,6 mil instalações, grátisoptimize writing-
O Claude lê seus textos de documentação e devolve a lista do que fere o guia de escrita da Vercel, linha por linha.Oficial106,4 mil instalações, grátisguidelines Vercel Labs
ai-
O Claude coloca chat, agente ou geração de texto no seu app conferindo a documentação da versão instalada, em vez de chutar de memória.Oficial66,1 mil instalações, grátissdk