HTML funcional, não mockups
Abra o arquivo, navegue por ele, publique. Sem ferramenta de design no meio.
Landing pages e sites de produto · Portfólios e sites pessoais · Lojas virtuais e painéis administrativos
Skills de design frontend para agentes de IA
Templates de design frontend que seu agente transforma em HTML funcional: landing pages, portfólios e dashboards inteiros, ou uma única seção de Hero, preços ou depoimentos.
Funciona com
Escolha uma Skill de página web para começar
O que as Skills de design frontend fazem
Toda Skill aqui termina em um arquivo que você abre no navegador.
Sites completos ou seções avulsas
Sites com várias páginas, ou uma única seção de Hero, depoimentos ou gráfico para encaixar em uma página que você já tem.
Responsivo por padrão
Os layouts são testados em larguras de desktop e celular antes da entrega.
Encontre Skills de página web para a sua função
Cada página de função reúne as Skills que mais combinam com aquele trabalho.
EmpreendedorSites de produto, pitch decks e vídeos de lançamento antes da primeira contratação.
DesignerUm design system que seu agente repete, para você cuidar dos detalhes.
Profissional de marketingPáginas de campanha, vídeos de lançamento e imagens para redes sociais a partir de um briefing.
Lojista de e-commercePáginas de loja, cartazes e vídeos promocionais para cada novo produto.Como criar uma página web 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-scrapbook-resume-site - 2
Chame com uma barra
Digite uma barra e o nome da Skill e depois diga o que você quer com palavras simples.
/bs-scrapbook-resume-site 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 página web em vez de um prompt?
Um prompt pode gerar uma página. Uma Skill de web acrescenta base no produto real, interação responsiva, validação e uma entrega fácil de manter.
| Critério | Um prompt simples | Uma Skill |
|---|---|---|
| Conteúdo | Preenche um template conhecido com texto genérico | Monta a página em torno do seu público real, dos fatos do produto e das provas |
| Interação | Desenha botões e abas que só parecem certos | Conecta estados reais, navegação e tratamento de erros |
| Entrega | Devolve um código que parece pronto | Segue a sua stack, lista as dependências e testa o uso no celular e pelo teclado |
O que você pode criar com uma Skill de design frontend
- 01Landing pages para um lançamento ou campanhaTransforme seus textos e imagens em uma página com seções claras e um botão de cadastro ou compra.
- 02Protótipos clicáveisSimule telas e botões reais para que sua equipe experimente o produto antes de ele ser construído.
- 03DashboardsOrganize números, tabelas e gráficos para que sejam fáceis de ler em qualquer tela.
- 04Partes de página reutilizáveisBotões, cards e layouts em um só estilo, para que as novas páginas combinem com as que você já tem.
Como escolher uma Skill de design frontend
- 1Escolha um estilo que combine com o seu produtoSaaS, portfólio, loja ou página de evento: escolha o visual que combina com o que você está criando.
- 2Experimente o exemplo ao vivoToda página de Skill tem um site de exemplo funcional para você navegar, no desktop e no celular.
- 3Baixe e experimenteInstale no seu agente e crie uma página com o seu próprio conteúdo. Em poucos minutos você saberá.
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.
Página web: perguntas frequentes sobre Skills
Posso usar uma Skill de web no meu projeto atual?
Sim, se a Skill disser que se adapta ao seu projeto. Caso contrário, ela entrega uma página independente e você planeja a integração.
Recebo HTML editável ou só uma prévia?
Código editável. Seu agente escreve os arquivos HTML para você, e a lista You get da página de detalhes informa exatamente os arquivos, assets e passos de execução.
Pagamentos e analytics já vêm conectados?
Não, a menos que a página de detalhes diga isso. Um botão de checkout ou um gráfico no design é só UI até você conectar o seu próprio serviço.
O que devo verificar antes de publicar a página?
Clique em todos os controles e teste a página em larguras de desktop e celular, só com o teclado e com movimento reduzido ativado. Verifique também textos longos, estados de erro e qualquer recurso de exportação ou offline prometido pela Skill.
Explore outros tipos de resultado
Encontre a Skill certa para a sua próxima página web
Landing pages, sites e páginas interativas em HTML funcional.
Ver todas as Skills