Breeze Prompt grátis
5 PLUGINS GRÁTIS · PARA O CLAUDE CODE

Transforma o Claude num gênio do design com esses cinco plugins grátis.

Chega de site com cara de IA. Copia o comando de cada um, instala em um minuto e o Claude passa a desenhar com estilo de site de verdade, acabamento fino e até 3D.

Baixar o guia (.md)

O prompt usa os cinco juntos. Instala os plugins primeiro, nos cards aqui embaixo.

Esses plugins são pro Claude Code do computador. Manda pra ti mesmo e abre lá.

Me manda o link por e-mail

Baixar o guia (.md)
Os 5 plugins

Copia, cola, instala

Os comandos "no terminal" vão no terminal do computador, dentro da pasta do teu site. Os que começam com / vão dentro do Claude Code.

  1. 1

    Awesome Design MD

    Sistemas de design tirados de sites reais como Stripe e Notion, prontos pro Claude copiar o estilo.

    no terminal, na pasta do site
    npx getdesign@latest add stripe

    Troca stripe por notion, linear, vercel, apple… São mais de 80 sites. Depois é só pedir: "usa o DESIGN.md".

    Ver no GitHub →
  2. 2

    Taste

    Regras de bom gosto por cima do Claude: tira a cara genérica de IA das páginas que ele cria.

    no terminal
    npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
    ou, dentro do Claude Code (as duas linhas juntas):
    /plugin marketplace add Leonxlnx/taste-skill
    /plugin install taste-skill@taste-skill
    Ver no GitHub →
  3. 3

    Impeccable

    Passada de acabamento: tu clica num elemento no navegador e o Claude te mostra variações dele.

    no terminal
    npx impeccable install
    ou, dentro do Claude Code (depois instala o Impeccable no menu /plugin):
    /plugin marketplace add pbakaus/impeccable

    Quando ele perguntar da checagem automática de design, responde que sim. O modo ao vivo é /impeccable live, com o site rodando no teu computador.

    Ver no GitHub →
  4. 4

    Playwright CLI

    O Claude abre teu site num navegador de verdade, clica, testa e tira print sozinho.

    no terminal (as duas linhas juntas)
    npm install -g @playwright/cli@latest
    playwright-cli install --skills
    Ver no GitHub →
  5. 5

    img2threejs

    Manda uma foto e o Claude refaz o objeto em 3D, em código, girando no navegador.

    no terminal
    npx --yes img2threejs@latest install

    Depois, no Claude Code: /img2threejs + a foto.

    Ver no GitHub →
Como usar

3 passos

  1. 1
    Instala os cinco: copia o comando de cada card e cola no terminal (ou no Claude Code, nos que começam com /).
  2. 2
    Fecha e abre o Claude Code de novo, pra ele enxergar os plugins novos.
  3. 3
    Abre a pasta do teu site no Claude Code e cola o prompt. Ele escolhe o estilo, faz a página, dá a passada de acabamento e testa no navegador.

Do que tu precisa

  • O Claude Code no computador.
  • O Node instalado (versão 22 ou mais nova cobre todos). O img2threejs pede também o Python 3.10 ou mais novo.
  • O Chrome (ou o Edge) no computador.
Antes que tu pergunte

Perguntas comuns

É grátis mesmo?

Sim. Os cinco são de código aberto e não pedem chave nem assinatura.

E se eu nunca usei o Claude Code?

É simples de instalar. A página oficial do Claude Code mostra o passo a passo pro teu sistema.

Precisa instalar os cinco?

Não. Cada um funciona sozinho. Se for pra começar com um, começa pelo Taste ou pelo Awesome Design MD.

Posso copiar o site da Stripe?

O estilo serve de referência. Usa a tua marca, as tuas cores e o teu texto por cima, pra não ficar igual ao deles.

A ideia é do @duncanrogoff

Ele juntou primeiro essas cinco ferramentas de design pro Claude Code. Vale ver o original.

Ver o vídeo original