Uma landing page a partir de um prompt
Descreva seu produto. A Skill já tem o Hero, a grade de recursos, os preços e o FAQ, então o agente escreve seus textos em um layout que funciona.
Uma landing page ou site completo · Uma seção para o seu site atual · Um portfólio ou currículo
Skills de templates de sites para agentes de IA
Cada Skill é um design de site testado. Instale, descreva seu produto e o Claude Code, o Codex ou o Cursor cria a landing page, o portfólio ou o site completo em HTML funcional.
Funciona com
Escolha uma Skill de web design para começar
O que uma Skill de web design dá ao seu agente
Cada Skill de design para Claude aqui é uma pasta de instruções, referências de layout e verificações. Seu agente a carrega quando você pede uma página, então as decisões de design já estão tomadas.
Templates que continuam consistentes
Portfólios, sites de SaaS e lojas virtuais mantêm a mesma tipografia, espaçamento e motion em cada página que você adiciona.
Design frontend entregue como código
Toda execução termina em um arquivo HTML que você pode abrir, editar e publicar. Claude Code, Codex e Cursor leem o mesmo SKILL.md.
Encontre Skills de web design para a sua função
Cada página de função reúne as Skills que mais combinam com aquele trabalho.
DesignerUm design system que seu agente repete, para você cuidar dos detalhes.
EmpreendedorSites de produto, pitch decks e vídeos de lançamento antes da primeira contratação.
Criador de conteúdoCapas, cards sociais e overlays para talking head no seu estilo.
Profissional de marketingPáginas de campanha, vídeos de lançamento e imagens para redes sociais a partir de um briefing.Como criar um site com uma Skill
Três passos no Claude Code, Codex ou Cursor. Sem precisar de app de design.
- 1
Cole o prompt de instalação
Copie o prompt de instalação para o seu agente ou execute o comando abaixo. A Skill vai para a pasta de skills do seu agente.
npx skillry-cli@latest install bs-basalt-dev-portfolio - 2
Chame com uma barra
Digite uma barra e o nome da Skill e depois diga o que você quer com palavras simples.
/bs-basalt-dev-portfolio Crie uma landing page responsiva a partir deste briefing, textos e brand kit. - 3
Revise e entregue
Abra o arquivo criado, peça alterações no mesmo chat e depois publique ou repasse.
index.html
Por que usar uma Skill de web design em vez de um prompt?
| Critério | Um prompt simples | Uma Skill |
|---|---|---|
| Layout | Reinventado a cada execução | Hero, grade e rodapé já testados |
| Tipografia | Fontes padrão do sistema | Uma escala tipográfica e uma combinação de fontes definidas |
| Consistência | Cada página tem uma cara diferente | Cada página segue um só sistema |
| Resultado | O que o modelo escrever | Um arquivo HTML verificado, pronto para abrir |
Todas as Skills, um só plano
Instale qualquer Skill desta página e todas as novas que adicionarmos. Cancele quando quiser.
Cancele quando quiser
Mensal
US$ 9,99 / mês
Acesso Premium completo, com cobrança mensal.
- Acesso a todas as Skills Premium
- Instale pela web ou pelo CLI
- Acesso seguro ao CLI com autorização pelo navegador
- Atualizações contínuas das Skills
- Novas Skills Premium incluídas
- Cancele quando precisar
Economize 34% ao ano
Mais popularAnual
US$ 79 / ano
Acesso Premium completo por um preço anual menor.
- Acesso a todas as Skills Premium
- Instale pela web ou pelo CLI
- Acesso seguro ao CLI com autorização pelo navegador
- Atualizações contínuas das Skills
- Novas Skills Premium incluídas
- Cancele quando precisar
Pagamento único · Preço de fundador
Oferta de fundadorFounding Lifetime
US$ 169 pagamento único
Preço de fundador — sobe conforme a biblioteca cresce.
- Acesso a todas as Skills Premium
- Instale pela web ou pelo CLI
- Acesso seguro ao CLI com autorização pelo navegador
- Atualizações contínuas das Skills
- Novas Skills Premium incluídas
- Sem assinatura nem cobrança de renovação
Cancele quando quiser. Os pagamentos são não reembolsáveis.
Web design: perguntas frequentes sobre Skills
O que é uma Skill de web design?
Uma pasta com um SKILL.md, referências de layout e verificações que ensina ao seu agente de IA um design de site comprovado. O agente a carrega quando você pede uma página.
O Claude Code consegue criar um site com uma Skill?
Sim. Instale a Skill no Claude Code, descreva o site e ele escreve o HTML seguindo o layout da Skill. O Codex e o Cursor funcionam do mesmo jeito.
Recebo HTML, React ou um arquivo do Figma?
A maioria das Skills de web design entrega um arquivo HTML funcional. Algumas também indicam saída em Next.js ou componentes na página de detalhes; nenhuma entrega arquivo do Figma.
Os templates de sites são gratuitos?
Algumas são. As Skills gratuitas têm o selo Free; as demais estão incluídas no Pro ou podem ser compradas avulsas.
Explore outros casos de uso
Encontre a Skill certa para o seu próximo site
Landing pages, portfólios e sites completos que seu agente cria.
Ver todas as Skills