30 plugins obrigatórios para Claude: segurança, brainstorming e design sem aparência de IA

Esta é uma seleção deliberadamente curta em relação aos grandes catálogos de plugins. O objetivo não é colecionar extensões, mas montar um conjunto de trabalho coerente para o Claude Code: dez plugins de segurança, dez de brainstorming e produto e dez de design, layout e verificação visual.

A preocupação central da parte visual é explícita: não produzir outro site com cara de template gerado por IA. Isso exige mais que um bom gerador de frontend. O conjunto escolhido obriga o processo a passar por identidade, pesquisa, princípios de design, direção estética, implementação, controle de consistência, navegador real e acessibilidade.

Resumo executivo

Os 30 selecionados formam três linhas de defesa:

Minha recomendação principal é instalar os 30, mas habilitar e invocar cada grupo conforme a fase do projeto. Muitos plugins incluem Skills e agentes acionados apenas quando relevantes; outros adicionam hooks ou servidores MCP com custo de contexto, execução ou credenciais. Ter tudo ativo o tempo inteiro não torna o Claude automaticamente melhor.

Os dez de design foram selecionados como uma cadeia:

1. entender pessoas e o problema;
2. registrar uma identidade própria;
3. estudar referências sem copiá-las;
4. justificar hierarquia e percepção;
5. definir tipografia, cor, espaçamento e composição;
6. implementar uma direção visual clara;
7. impedir que o código se afaste dos tokens;
8. renderizar a interface;
9. inspecionar console, rede, responsividade e desempenho;
10. corrigir acessibilidade.

Essa cadeia é mais eficaz contra o “visual de IA” que qualquer prompt dizendo apenas “faça bonito”.

Metodologia e critérios

A pesquisa conferiu, em 24 de julho de 2026, os catálogos claude-plugins-official, claude-community, o marketplace demonstrativo do Claude Code e o marketplace upstream da Endor Labs, além dos repositórios de origem. Na verificação realizada, o catálogo oficial continha 273 entradas e o comunitário 2.263. Os 30 projetos selecionados tinham distribuição identificada nos catálogos consultados. No caso da Endor Labs, a entrada histórica do catálogo oficial e o identificador atual recomendado pelo upstream são explicados na seção de instalação.

Para entrar nesta lista, um plugin precisou cumprir a maior parte destes critérios:

• resolver uma etapa concreta e recorrente;
• complementar os outros em vez de apenas repetir a mesma promessa;
• ter página de origem identificável e repositório não arquivado;
• produzir evidência, artefato ou verificação útil;
• funcionar no fluxo real de construção de aplicações e sites;
• ter instalação clara pelo sistema de plugins do Claude;
• expor limitações que possam ser administradas;
• no design, combater decisões genéricas por identidade e critérios, não só por adjetivos estéticos.

As descrições de capacidades foram cruzadas com o manifesto atual do marketplace e, quando disponível, com o README do autor. “Obrigatório” aqui significa a melhor caixa de ferramentas básica para este perfil de uso, não uma garantia de qualidade ou segurança.

Legenda de origem

• Oficial: aparece no marketplace claude-plugins-official, disponível por padrão no Claude Code. Isso pode incluir plugins da Anthropic e integrações de terceiros.
• Comunidade: aparece no marketplace claude-community, espelho mantido pela Anthropic e sincronizado a partir do processo de revisão do diretório.
• Oficial/upstream: o projeto aparece no catálogo oficial, mas o próprio fornecedor mantém um marketplace com identificador mais recente e instruções de instalação atualizadas.
• A presença em um marketplace é um sinal útil de distribuição, mas não elimina a necessidade de revisar código, permissões, hooks, MCPs e dependências.

Instalação segura

Atualize o Claude Code antes de começar. O marketplace oficial normalmente já vem registrado. Adicione o comunitário e atualize ambos:

claude plugin marketplace update claude-plugins-official
claude plugin marketplace add anthropics/claude-plugins-community
claude plugin marketplace update claude-community
claude plugin marketplace add endorlabs/ai-plugins

O último comando adiciona o marketplace upstream da Endor Labs. O catálogo oficial da Anthropic ainda apresenta a entrada histórica ai-plugins, mas o projeto recomenda atualmente o pacote endor-labs-agent-kit@endorlabs.

Os comandos abaixo instalam os plugins no escopo do usuário. Para compartilhar uma seleção controlada com uma equipe, troque user por project. Para usar somente em um projeto sem versionar a configuração, use local.

#Segurança
claude plugin install security-guidance@claude-plugins-official --scope user
claude plugin install pr-review-toolkit@claude-plugins-official --scope user
claude plugin install dependency-evaluator@claude-community --scope user
claude plugin install dx-guard@claude-community --scope user
claude plugin install endor-labs-agent-kit@endorlabs --scope user
claude plugin install aikido@claude-plugins-official --scope user
claude plugin install clover@claude-community --scope user
claude plugin install backend-security-skills@claude-community --scope user
claude plugin install 42crunch-api-security-testing@claude-plugins-official --scope user
claude plugin install claude-security@claude-plugins-official --scope user

#Brainstorming e produto
claude plugin install 16minds@claude-community --scope user
claude plugin install andie@claude-community --scope user
claude plugin install critical-thinking-tools@claude-community --scope user
claude plugin install decision-council@claude-community --scope user
claude plugin install decision-simulator@claude-community --scope user
claude plugin install challenger@claude-community --scope user
claude plugin install cookiy@claude-community --scope user
claude plugin install ai-pm@claude-community --scope user
claude plugin install grainulator@claude-community --scope user
claude plugin install blueprint-trigger@claude-community --scope user

#Design, layout e validação visual
claude plugin install frontend-design@claude-plugins-official --scope user
claude plugin install designs-drift@claude-community --scope user
claude plugin install brand-md@claude-community --scope user
claude plugin install designwithclaude@claude-community --scope user
claude plugin install the-design-library@claude-community --scope user
claude plugin install universal-design-principles@claude-community --scope user
claude plugin install perception-first-design@claude-community --scope user
claude plugin install playwright@claude-plugins-official --scope user
claude plugin install chrome-devtools-mcp@claude-plugins-official --scope user
claude plugin install a11y-fixer@claude-community --scope user

Antes de confirmar cada instalação, abra /plugin, leia Will install e observe Skills, agentes, hooks, MCPs, executáveis e permissões. Depois use:

claude plugin list
claude plugin details security-guidance@claude-plugins-official

plugin details ajuda a ver os componentes e o custo estimado de contexto. Plugins que executam navegador, scanners ou serviços externos podem exigir Node.js, Python, binários, contas ou chaves. Nunca coloque segredos em prompts, arquivos de identidade visual ou regras versionadas.

Visão rápida dos 30 obrigatórios

Segurança: os dez plugins obrigatórios

1. Security Guidance

• Links: página do plugin e código-fonte.
• O que acrescenta: três camadas. Há alertas por padrões perigosos durante Edit e Write, revisão do diff por modelo no fim do turno e revisão agentiva no commit, capaz de seguir fluxo entre arquivos.
• Por que é obrigatório: trabalha enquanto o código nasce. É melhor impedir innerHTML inseguro, segredo fixo, desserialização perigosa ou SSRF do que descobrir tudo no final.
• Use assim: deixe habilitado em todo projeto de código e acrescente regras específicas em .claude/claude-security-guidance.md.
• Limite real: envia diff e conteúdo relevante ao endpoint de modelo configurado, consome chamadas adicionais e pode errar. O próprio projeto diz que não substitui revisão humana, SAST, DAST, scanner de dependências ou pentest.

2. PR Review Toolkit

• Links: página do plugin e código-fonte.
• O que acrescenta: seis agentes especializados em comentários, cobertura e qualidade de testes, falhas silenciosas, desenho de tipos, qualidade geral e simplificação.
• Por que é obrigatório: uma única revisão genérica costuma privilegiar o erro mais visível. Separar lentes aumenta a chance de encontrar tratamento de erro frágil, teste superficial e complexidade desnecessária.
• Use assim: ao terminar uma feature ou antes do PR, invoque apenas as lentes relacionadas ao risco e depois uma rodada completa.
• Limite real: é revisão por modelo, não execução de teste. Uma sugestão só deve virar alteração depois de confirmada no código e na suíte.

3. Dependency Evaluator

• Link: repositório e código-fonte.
• O que acrescenta: pesquisa metadados e fonte de pacotes npm e Python, observa manutenção e complexidade e devolve um veredito USE, EXTRACT ou BUILD.
• Por que é obrigatório: evita instalar uma biblioteca grande, abandonada ou suspeita para resolver uma função pequena. Também procura sinais como typosquatting e injeção por .pth.
• Use assim: antes de todo npm install, pnpm add ou pip install que introduza dependência direta.
• Limite real: o veredito é uma avaliação, não prova de ausência de malware. Confirme nome, mantenedor, versão, licença, hash e advisories.

4. DX Guard

• Link: repositório e código-fonte.
• O que acrescenta: intercepta instalações em npm, pip, pnpm, Yarn e Bun e consulta dados do OSV.dev para alertar sobre CVEs ou bloquear pacotes maliciosos conhecidos.
• Por que é obrigatório: é a barreira operacional que complementa o julgamento do Dependency Evaluator. Um pensa antes da escolha; o outro vigia o comando de instalação.
• Use assim: habilitado globalmente, principalmente em tarefas nas quais o Claude pode escolher dependências sozinho.
• Limite real: “não encontrado no OSV” não significa seguro. Pacotes novos, ataques ainda não catalogados e scripts de pós-instalação exigem cautela.

5. Endor Labs Agent Kit

• Links: entrada no catálogo oficial da Anthropic e repositório oficial.
• O que acrescenta: um conjunto de agentes e Skills de AppSec para remediação de SCA, triagem de AI SAST, postura de CI/CD e supply chain, resposta a malware, revisão de dependências, análise de impacto de upgrades, explicação de vulnerabilidades e navegação por achados.
• Por que é obrigatório: cobre o caminho entre “há um alerta” e “qual é a correção mais segura”. O projeto combina evidência de dependências, alcançabilidade, inventário, pipelines e contexto do repositório, uma lacuna que os guardas locais e a revisão por modelo não cobrem sozinhos.
• Use assim: execute primeiro o Skill de setup, faça avaliações somente leitura e exija um plano de remediação antes de permitir alterações, criação de branch, ticket ou pull request. O próprio kit distingue agentes read-only de fluxos mutáveis sujeitos a aprovação.
• Limite real: o conjunto é grande e depende de endorctl, autenticação e acesso compatível à plataforma Endor Labs para entregar toda a cobertura. Em projeto pequeno ou offline, use apenas quando o ganho de supply chain justificar a conta, o contexto adicional e a exposição controlada de dados.

6. Aikido

• Links: página do plugin e repositório.
• O que acrescenta: SAST, procura de segredos e análise de infraestrutura como código por meio do servidor MCP da Aikido.
• Por que é obrigatório: amplia o escopo para além do código da aplicação. Dockerfiles, manifests, configuração de nuvem e credenciais acidentais fazem parte do risco real de um projeto.
• Use assim: antes de publicar uma imagem, infraestrutura ou alteração que envolva autenticação e segredos.
• Limite real: há sobreposição com o Endor Labs Agent Kit em SAST e dependências, e o serviço pode exigir conta, autenticação e plano compatível. Use os dois apenas quando a cobertura de segredos e IaC justificar o custo e a exposição controlada do código.

7. Clover

• Link: repositório e código-fonte.
• O que acrescenta: modelagem de ameaças silenciosa sobre o plano, buscando requisitos de segurança ausentes antes de escrever código.
• Por que é obrigatório: scanners chegam tarde para decisões arquiteturais. O Clover força perguntas sobre fronteiras de confiança, autorização, dados sensíveis e abuso quando ainda é barato mudar o desenho.
• Use assim: ao planejar login, upload, webhook, API pública, painel administrativo, pagamento ou integração externa.
• Limite real: é uma lente de threat modeling, não um scanner. Exija que cada ameaça importante vire requisito, teste ou controle verificável.

8. Backend Security Skills

• Link: repositório e código-fonte.
• O que acrescenta: reconhecimento de rotas, matriz de autenticação, invariantes, auditoria por oito agentes alinhada ao OWASP API Top 10 e sondagem HTTP com transcrições reproduzíveis.
• Por que é obrigatório: combina bem com a stack do usuário: Express, NestJS, Fastify, Koa, Next.js, FastAPI, Django, Flask e Starlette.
• Use assim: primeiro em análise estática; faça testes HTTP somente em sistemas próprios ou com autorização explícita e, de preferência, em staging.
• Limite real: sondagens podem alterar dados, disparar limites ou afetar o serviço. Defina host, conta de teste, escopo, métodos permitidos e janela.

9. 42Crunch API Security Testing

• Links: página do plugin, repositório e documentação.
• O que acrescenta: auditoria estática de OpenAPI, detecção de riscos como BOLA e BFLA, testes de conformidade e autorização e ciclo de correção e nova validação.
• Por que é obrigatório: APIs quebram frequentemente na autorização por objeto ou função, algo que lint genérico não resolve bem.
• Use assim: mantenha o OpenAPI como contrato versionado, audite cada mudança e teste dinamicamente em ambiente controlado.
• Limite real: testes dinâmicos precisam de alvo, credenciais e dados seguros. Recursos podem depender de conta ou plano da 42Crunch.

10. Claude Security

• Links: página do plugin e código-fonte.
• O que acrescenta: varredura profunda do próprio código em um nível de esforço escolhido. Cada achado é contestado antes de ser apresentado, e os sobreviventes podem virar patches direcionados, verificados por um painel de agentes e aplicados somente quando o usuário autorizar.
• Por que é obrigatório: ocupa o lugar da auditoria profunda do conjunto. Security Guidance acompanha a edição; Claude Security abre uma investigação deliberada e adversarial.
• Use assim: ao terminar uma feature sensível, antes de release ou depois de uma mudança importante de autenticação, autorização, upload ou dados.
• Limite real: a análise ocorre dentro da sessão do Claude, mas continua sendo revisão por agentes. Confirme cada sobrevivente com teste, scanner, reprodução ou revisão humana e aplique patches individualmente.

Brainstorming e produto: os dez plugins obrigatórios

11. 16minds

• Link: repositório e código-fonte.
• O que acrescenta: 16 perspectivas com valores, padrões de pensamento e tons diferentes; pode consultar uma mente, promover debate em dupla ou abrir o painel completo.
• Por que é obrigatório: é ótimo para a fase divergente, quando uma resposta média e bem-comportada mata ideias estranhas antes de avaliá-las.
• Use assim: gere opções com /minds, agrupe os desacordos e só então aplique critérios de viabilidade. Os modos leve, médio e pesado controlam custo e profundidade.
• Limite real: são perspectivas simuladas pelo mesmo tipo de sistema, não 16 pessoas independentes. Diversidade de voz não é diversidade de evidência.

12. Andie

• Link: repositório e código-fonte.
• O que acrescenta: quatro modos: Deep para explicar, Drama para debater, Triage para crise e Kaizen para encontrar desperdício e melhorar.
• Por que é obrigatório: oferece uma parceira de pensamento rápida para situações que não justificam um conselho completo.
• Use assim: Deep para aprender o domínio, Drama antes de escolher, Triage quando há incidente e Kaizen depois da entrega.
• Limite real: não deixe o estilo confiante substituir dados. Em Triage, preserve logs, limite mudanças e confirme o diagnóstico.

13. Critical Thinking Tools

• Link: repositório e código-fonte.
• O que acrescenta: 12 ferramentas, incluindo advogado do diabo, pré-mortem, visão externa, hipóteses concorrentes, steelman, taxas-base, calibração e diário de decisão.
• Por que é obrigatório: transforma “pense melhor” em procedimentos repetíveis e registra o que faria a conclusão mudar.
• Use assim: escolha uma ferramenta por problema. Use pré-mortem para planos, hipóteses concorrentes para diagnóstico e taxa-base para previsões.
• Limite real: um checklist não remove viés por mágica. A qualidade depende da evidência inserida e da disposição de abandonar a hipótese favorita.

14. Decision Council

• Links: site e repositório.
• O que acrescenta: painel de conselheiros, exame cruzado, agente “Mirror” para verdade desconfortável, pré-mortem, pontuação e registro de decisão.
• Por que é obrigatório: decisões caras merecem raciocínio auditável, não uma conversa que desaparece.
• Use assim: forneça opções, critérios, restrições e prazo. Salve a decisão, previsão e sinais que exigiriam revisão.
• Limite real: pontuações podem transmitir precisão falsa. Elas servem para comparar suposições, não para transformar opinião em estatística.

15. Decision Simulator

• Link: repositório e código-fonte.
• O que acrescenta: comparação de caminhos de implementação, bibliotecas, refactors, limites de serviço e decisões arquiteturais.
• Por que é obrigatório: é mais leve e técnico que o Decision Council, ideal para as dezenas de microdecisões de um projeto.
• Use assim: peça matriz com custo agora, custo futuro, reversibilidade, risco operacional, conhecimento da equipe e evidência ausente.
• Limite real: simular não mede. Faça protótipo ou benchmark quando a decisão depende de desempenho, compatibilidade ou comportamento externo.

16. Challenger

• Link: repositório e código-fonte.
• O que acrescenta: quatro agentes adversariais: Skeptic, Sentinel, Architect e Pragmatist. Eles procuram evidência no código e no histórico Git em rodadas de intensidade variável.
• Por que é obrigatório: combate concordância automática e obriga o plano a sobreviver a ataques técnicos, de segurança, arquitetura e simplicidade.
• Use assim: depois de um plano aparentemente bom, antes de uma refatoração grande ou mudança irreversível.
• Limite real: crítica excessiva paralisa. Defina critério de encerramento: riscos críticos resolvidos, riscos aceitos registrados e próxima ação clara.

17. Cookiy

• Links: site e repositório.
• O que acrescenta: plano de pesquisa, screener, roteiro de entrevista, survey e síntese de notas ou transcrições com rastreabilidade da evidência.
• Por que é obrigatório: interfaces com identidade começam em pessoas, linguagem e necessidades reais, não em componentes.
• Use assim: antes do briefing visual e novamente depois do protótipo. Separe observação, interpretação e recomendação.
• Limite real: recursos de entrevistas ou recrutamento por IA podem depender do serviço Cookiy. Não invente participantes nem trate respostas sintéticas como pesquisa com usuários.

18. AI PM

• Link: repositório e código-fonte.
• O que acrescenta: transforma notícias, feedback e pesquisa em PRDs e diretrizes por debates entre perspectivas de stakeholders.
• Por que é obrigatório: fecha a lacuna entre uma boa ideia e requisitos que design e engenharia conseguem verificar.
• Use assim: alimente somente fontes identificadas; exija problema, não-objetivos, critérios de aceitação, métricas, riscos e perguntas abertas.
• Limite real: PRD longo não é produto validado. Corte qualquer requisito sem usuário, evidência ou ligação com o objetivo.

19. Grainulator

• Links: site e repositório.
• O que acrescenta: sprint de pesquisa em que achados viram claims tipados, recebem grau de confiança, passam por contestação e formam um brief autocontido.
• Por que é obrigatório: brainstorming útil precisa convergir para fatos, incertezas e decisão, não apenas uma lista bonita de ideias.
• Use assim: para mercado, concorrentes, arquitetura ou decisões que exigem pesquisa. Abra as fontes e confira as afirmações de alto impacto.
• Limite real: confiança atribuída pelo processo continua sendo estimativa. Fonte fraca bem formatada continua fraca.

20. Blueprint Trigger

• Link: repositório e código-fonte.
• O que acrescenta: entrevista de intake que detecta pedidos misturados ou ambíguos e gera um cartão de briefing antes de abrir o Figma ou escrever UI.
• Por que é obrigatório: “faça um dashboard moderno” quase sempre leva ao visual genérico. Um briefing força objetivo, público, contexto, conteúdo, restrições e definição de pronto.
• Use assim: no início de toda interface. Complete o cartão com exemplos reais de conteúdo e anti-referências.
• Limite real: o projeto declara adaptação a inglês e espanhol. Em PT-BR, revise terminologia e preserve as palavras reais do usuário.

Design e layout: os dez plugins obrigatórios

21. Frontend Design

• Links: página do plugin e código-fonte.
• O que acrescenta: Skill oficial que escolhe uma direção estética clara e gera frontend de produção com tipografia, paleta, movimento e detalhes contextuais.
• Por que é obrigatório: o objetivo declarado pelo próprio plugin é evitar estética genérica de IA. Ele é o implementador central, não o processo todo.
• Use assim: entregue a ele o brand.md, briefing, conteúdo verdadeiro, público, referências e anti-referências. Peça uma direção nomeada antes do código.
• Limite real: sem contexto, qualquer gerador recai em convenções. “Ousado” também pode virar excesso de animação, baixa legibilidade ou decoração sem função.

22. Design Drift

• Link: repositório e código-fonte.
• O que acrescenta: extrai restrições de Skills e arquivos DESIGN.md e verifica cor, fonte, espaçamento e raio quando arquivos de UI são escritos ou editados.
• Por que é obrigatório: identidade visual não vale nada se cada nova tela ganha um azul, raio e espaçamento diferentes. O hook transforma o sistema de design em guarda ativa.
• Use assim: estabeleça tokens semânticos antes de habilitar a fiscalização e corrija violações na origem, não com exceções aleatórias.
• Limite real: tokens consistentes não garantem boa composição. Regras rígidas demais podem impedir exceções intencionais; documente-as.

23. Brand.md

• Links: site do padrão e repositório.
• O que acrescenta: pesquisa de mercado, entrevista com o fundador e um brand.md com estratégia, voz, identidade e direção visual persistentes.
• Por que é obrigatório: é a memória que impede cada sessão do Claude de reinventar a marca. Também separa personalidade de tendências passageiras.
• Use assim: responda com exemplos concretos, palavras proibidas, referências e anti-referências. Versione o arquivo e revise quando a marca mudar.
• Limite real: o Claude não conhece uma marca inexistente melhor que o dono. Não aceite biografia, público, diferencial ou valor inventado.

24. Design with Claude

• Links: site e repositório.
• O que acrescenta: 29 especialistas em hierarquia, tipografia, cor, movimento, formulários, navegação, dashboards, mobile, responsividade, dark mode, onboarding, erros e visualização de dados.
• Por que é obrigatório: substitui conselhos vagos por revisão focada em uma disciplina. É puro conteúdo de Skills, sem runtime, API ou dependências.
• Use assim: comece pelo briefing mestre e convoque somente os especialistas necessários. Peça decisões com justificativa e exemplos aplicados.
• Limite real: muitos especialistas podem produzir recomendações conflitantes. A direção de arte e as prioridades do produto decidem.

25. The Design Library

• Link: repositório e código-fonte.
• O que acrescenta: biblioteca de 58 sistemas de marcas conhecidas e cinco Skills para geração de UI/UX, acessibilidade, motion, web e ciclo completo.
• Por que é obrigatório: amplia o repertório visual do Claude e facilita comparar soluções concretas, em vez de repetir o mesmo dashboard.
• Use assim: combine princípios de duas ou três referências e traduza-os para sua marca. Registre o que foi aprendido: ritmo, densidade, contraste, navegação ou movimento.
• Limite real: não copie identidade, logotipo, ilustrações ou composição de Stripe, Linear, Vercel ou qualquer outra marca. Referência é análise, não clonagem.

26. Universal Design Principles

• Link: repositório e código-fonte.
• O que acrescenta: 42 princípios de design e HCI organizados em cinco plugins combináveis, totalizando 137 Skills no catálogo anunciado.
• Por que é obrigatório: dá vocabulário para discutir affordance, hierarquia, feedback, carga, consistência e erros sem reduzir tudo a gosto.
• Use assim: peça uma auditoria curta com no máximo cinco princípios relevantes e uma alteração verificável para cada um.
• Limite real: princípios entram em conflito. Consistência, novidade, eficiência e descoberta não podem ser maximizadas ao mesmo tempo.

27. Perception-First Design

• Links: site e repositório.
• O que acrescenta: estrutura de cinco camadas que começa por restrições cognitivas e perceptivas antes de propor a solução visual.
• Por que é obrigatório: obriga o Claude a perguntar o que precisa ser percebido primeiro, distinguido, lembrado e acionado. Isso produz hierarquia, não decoração.
• Use assim: aplique a páginas de venda, onboarding, dashboards densos e fluxos em que um erro de atenção custa caro.
• Limite real: psicologia aplicada não autoriza alegações universais. Valide com usuários, métricas de tarefa e testes de contraste.

28. Playwright

• Links: página do plugin, wrapper do marketplace e servidor da Microsoft.
• O que acrescenta: navegador automatizado para navegar, clicar, preencher, tirar screenshots e executar testes ponta a ponta a partir do Claude.
• Por que é obrigatório: HTML correto no arquivo pode quebrar no navegador. Playwright transforma opinião sobre layout em comportamento reproduzível.
• Use assim: teste desktop, aproximadamente 390 px, teclado, estados vazios, erro, loading e conteúdo longo. Salve testes críticos no repositório.
• Limite real: a automação baseada na árvore de acessibilidade não substitui avaliação visual. O servidor pede Node.js 18 ou superior e pode manipular sessões reais; use perfis e contas de teste.

29. Chrome DevTools MCP

• Links: página do plugin e repositório oficial.
• O que acrescenta: controle e inspeção de Chrome, console com stack trace, rede, performance traces e automação por Puppeteer.
• Por que é obrigatório: complementa o Playwright. Um reproduz fluxos; o outro explica por que a página está lenta, quebrada ou fazendo requisições erradas.
• Use assim: depois do teste funcional, confira erros de console, requests falhos, fontes, imagens, layout shifts e gargalos.
• Limite real: DevTools pode expor cookies, tokens, respostas e dados da sessão ao agente. Use navegador isolado e nunca entregue acesso desnecessário a contas pessoais.

30. A11y Fixer

• Link: código-fonte.
• O que acrescenta: varredura inicial de HTML e JSX para problemas de acessibilidade e proposta de correções.
• Por que é obrigatório: acessibilidade afeta estrutura, interação e qualidade. Também expõe “componentes bonitos” que falham sem mouse ou leitor de tela.
• Use assim: rode antes do teste de navegador; depois valide foco visível, ordem de tabulação, nomes acessíveis, contraste, zoom e mensagens de erro.
• Limite real: a descrição do catálogo é curta e o plugin não substitui axe, testes automatizados, leitor de tela nem revisão manual conforme WCAG.

Como impedir que o resultado pareça feito por IA

Não existe detector confiável de “design feito por IA”. O que existe é um conjunto recorrente de sinais de baixa direção: hero intercambiável, gradiente roxo ou azul sem motivo, cartões arredondados em toda seção, três colunas idênticas, texto promocional vazio, excesso de pills, ícones aleatórios, tipografia padrão, espaçamento uniforme demais e animação decorativa.

Esses elementos não são proibidos. O problema é usá-los como padrão automático, sem relação com público, conteúdo ou marca.

Fluxo obrigatório para cada site ou aplicativo

1. Comece no problema, não na tela

Use Cookiy para organizar pesquisa existente e Blueprint Trigger para produzir o briefing. Inclua:

• quem usa;
• qual tarefa precisa terminar;
• em que ambiente;
• qual conteúdo real aparecerá;
• quais estados de erro, vazio e loading existem;
• quais sites inspiram e o que exatamente inspira;
• quais clichês devem ser evitados.

2. Dê uma memória de marca ao Claude

Use Brand.md e registre:

• personalidade em três a cinco atributos observáveis;
• voz e exemplos reais de texto;
• palavras proibidas;
• tipografia e alternativas disponíveis;
• cores e significado semântico;
• densidade, raios, sombras e ritmo;
• referências e anti-referências;
• limites de acessibilidade e movimento.

“Moderno, elegante e minimalista” não é direção. “Editorial técnico, denso, tipografia serifada nos títulos, informação primeiro, sem gradientes e sem cartões flutuantes” já começa a ser.

3. Abra o repertório sem clonar

Use The Design Library para estudar sistemas e 16minds para gerar direções diferentes. Peça três propostas com nomes claros, por exemplo:

• arquivo técnico editorial;
• painel de oficina;
• catálogo retrofuturista.

Cada proposta deve explicar grade, densidade, tipografia, cor, textura, movimento e por que serve ao produto. Não misture as três em uma colagem.

4. Escolha com princípios

Passe as direções por Universal Design Principles e Perception-First Design. Pergunte:

• o que o olhar percebe primeiro;
• qual ação é inequívoca;
• onde há carga cognitiva;
• como o sistema responde;
• quais elementos competem;
• qual decisão visual é apenas moda.

Use Decision Council ou Critical Thinking Tools se a escolha tiver impacto grande.

5. Escreva a direção antes do código

Use o briefing mestre do Design with Claude. Aprove:

• grade e largura;
• escala tipográfica;
• tokens semânticos;
• estilo de ilustração e ícones;
• bordas, raios e sombras;
• comportamento responsivo;
• movimento e prefers-reduced-motion;
• cinco componentes-chave;
• exemplos de conteúdo real.

6. Implemente uma direção, não uma média

Entregue todo o contexto ao Frontend Design. Peça primeiro uma frase de direção estética e uma pequena lista de decisões. Só então autorize o código. Se o resultado recuar para clichês, use Challenger para perguntar onde a implementação traiu o briefing.

7. Trave a consistência

Converta as decisões em tokens e ative Design Drift. O plugin não deve “embelezar”; deve impedir que novas telas inventem valores desconectados.

8. Veja o produto funcionando

Use Playwright para fluxos e screenshots, Chrome DevTools MCP para console, rede e performance e A11y Fixer como primeira passagem de acessibilidade. Verifique:

• desktop e celular estreito;
• conteúdo curto, longo e ausente;
• teclado e foco;
• contraste e zoom;
• erro e espera;
• fontes e imagens indisponíveis;
• console sem erros;
• redução de movimento;
• velocidade e estabilidade do layout.

Sobreposição: qual plugin faz o quê

Security Guidance, Endor Labs Agent Kit e Aikido

• Security Guidance acompanha a edição e revisa o diff.
• Endor Labs Agent Kit correlaciona SCA, SAST, alcançabilidade, CI/CD, malware e caminhos de remediação.
• Aikido verifica código, segredos e infraestrutura como código.

Use Security Guidance como guarda durante a edição. Acrescente Endor Labs quando o projeto exigir análise de supply chain, priorização e remediação de dependências. Use Aikido quando a cobertura de segredos, SAST e IaC justificar uma segunda plataforma externa.

Dependency Evaluator e DX Guard

• Dependency Evaluator pergunta se a dependência deve existir.
• DX Guard fiscaliza o pacote que está prestes a ser instalado.

Um não substitui o outro: decisão arquitetural e inteligência de vulnerabilidades são problemas distintos.

16minds, Decision Council e Challenger

• 16minds expande o espaço de ideias.
• Decision Council compara e registra uma escolha.
• Challenger tenta destruir o plano escolhido com evidência do projeto.

A ordem correta é divergir, decidir e desafiar.

Brand.md e Design Drift

• Brand.md define quem o produto é.
• Design Drift cobra que a implementação permaneça coerente.

Sem Brand.md, o fiscal não sabe o que fiscalizar. Sem Design Drift, a memória de marca pode virar documento esquecido.

Playwright e Chrome DevTools MCP

• Playwright reproduz jornadas e afirma resultados.
• Chrome DevTools MCP investiga a execução interna da página.

Playwright responde “funciona?”. DevTools ajuda a responder “por que quebrou ou ficou lento?”.

O que ficou de fora e por quê

Anti-Slop UI

O catálogo comunitário ainda descrevia Anti-Slop UI como uma ferramenta feita especificamente para remover aparência de IA. Porém, durante esta pesquisa, o repositório de origem informado pelo catálogo retornou 404. Por isso ele não entrou entre os obrigatórios. Design Drift, Brand.md, Frontend Design e o fluxo de crítica cobrem o objetivo com fontes acessíveis.

Figma e plugins específicos de bibliotecas

Figma Suite, Bridge DS, Tailwind Design System, shadcn/ui, Material, Shopify e outros podem ser excelentes, mas não são universais. Instale-os quando o projeto realmente usa aquela plataforma ou biblioteca. O núcleo de 30 deve continuar útil em projetos variados.

Plugins que prometem construir tudo sozinhos

Orquestradores enormes podem ser produtivos, mas também escondem decisões, consomem contexto e criam sobreposição. Esta seleção prefere ferramentas com papéis claros e uma sequência que o usuário consegue auditar.

Riscos e regras de segurança para os próprios plugins

Plugins são código confiável no sentido operacional: podem incluir hooks, executáveis, agentes, MCPs e acesso a serviços. Portanto:

1. leia a origem e Will install;
2. confira se o repositório ainda existe e não está arquivado;
3. prefira versão fixada quando estabilidade ou supply chain forem críticas;
4. revise .mcp.json, hooks e comandos antes de habilitar;
5. use credenciais de menor privilégio e contas de teste;
6. separe navegador pessoal do navegador de automação;
7. não permita scans dinâmicos fora de sistemas autorizados;
8. não coloque segredo em brand.md, DESIGN.md, prompts ou logs;
9. valide achados do modelo com scanner, teste ou reprodução;
10. desabilite plugins sem uso para reduzir superfície e custo de contexto.

O marketplace comunitário informa que as entradas passaram por análise automatizada e aprovação para distribuição. Isso é uma triagem, não uma auditoria permanente de cada dependência futura. O diretório oficial também alerta que a Anthropic não controla todo MCP, arquivo ou software externo incluído nos plugins.

Recomendações práticas

Núcleo para deixar habilitado em quase todo projeto

1. Security Guidance;
2. Dependency Evaluator;
3. DX Guard;
4. PR Review Toolkit;
5. Critical Thinking Tools;
6. Brand.md;
7. Frontend Design;
8. Design Drift.

Habilite quando houver interface em execução

1. Design with Claude;
2. The Design Library;
3. Universal Design Principles;
4. Perception-First Design;
5. Playwright;
6. Chrome DevTools MCP;
7. A11y Fixer.

Habilite conforme o risco

• Endor Labs Agent Kit: projetos com muitas dependências, supply chain relevante, postura de CI/CD ou uma conta Endor Labs já disponível.
• Aikido: segredos, IaC e cobertura complementar.
• Clover: autenticação, upload, webhook, pagamentos e dados sensíveis.
• Backend Security Skills: APIs Node.js e Python.
• 42Crunch: APIs com contrato OpenAPI.
• Claude Security: fechamento de feature sensível ou preparação de release.

Habilite conforme a fase de descoberta

• 16minds: gerar alternativas.
• Andie: aprender, debater, fazer triagem ou Kaizen.
• Cookiy: pesquisa de usuário.
• AI PM: transformar evidência em PRD.
• Grainulator: pesquisa com claims e confiança.
• Blueprint Trigger: briefing inicial.
• Decision Council: decisão relevante.
• Decision Simulator: trade-off técnico.
• Challenger: atacar o plano escolhido.

Prompt-base para um layout com identidade

Antes de escrever código:

1. leia brand.md, DESIGN.md e o briefing;
2. descreva o público, a tarefa principal e o conteúdo real;
3. proponha três direções visuais realmente diferentes;
4. para cada direção, defina grade, densidade, tipografia, cor, textura,
   movimento e anti-padrões;
5. critique os clichês que fariam a interface parecer um template de IA;
6. escolha uma direção e explique por que ela vence;
7. implemente apenas essa direção com tokens semânticos;
8. preserve acessibilidade, responsividade e redução de movimento;
9. renderize em desktop e 390 px, inspecione console e rede;
10. apresente screenshots, problemas encontrados e correções realizadas.

Não use gradiente, cartão, pill, glassmorphism, animação ou ícone apenas porque
são convenções de landing pages. Cada elemento precisa ter função e relação com
a identidade.

Conclusão

Os 30 plugins obrigatórios não são 30 maneiras de pedir ao Claude que “faça melhor”. Eles distribuem responsabilidades: investigar, divergir, decidir, ameaçar o plano, registrar identidade, implementar, fiscalizar, renderizar e testar.

Para segurança, a base mais equilibrada é Security Guidance + Dependency Evaluator + DX Guard. Acrescente Endor Labs Agent Kit para supply chain, priorização e remediação, e use Clover, Aikido, Backend Security Skills e 42Crunch conforme o risco. Para raciocínio, a sequência é Cookiy ou Grainulator → 16minds → Decision Council → Challenger. Para design sem aparência genérica, a sequência essencial é Brand.md → Design Library → Universal Design Principles/Perception-First → Design with Claude → Frontend Design → Design Drift → Playwright/DevTools/A11y Fixer.

O resultado deixa de parecer “feito por IA” quando a IA deixa de tomar decisões visuais no vazio. Identidade concreta, conteúdo real, restrições, referências analisadas, crítica e validação no navegador fazem mais diferença que qualquer efeito chamativo.

Fontes consultadas

• Documentação oficial: descobrir e instalar plugins
• Referência oficial de plugins e escopos
• Diretório oficial de plugins
• Marketplace comunitário
• Security Guidance
• PR Review Toolkit
• Dependency Evaluator
• DX Guard
• Endor Labs Agent Kit
• Aikido Claude Plugin
• Clover Claude Plugin
• Backend Security Skills
• 42Crunch Claude Plugins
• Claude Security
• 16minds
• Andie
• Critical Thinking Tools
• Decision Council
• Decision Simulator
• Challenger
• Cookiy User Research Skill
• AI PM
• Grainulator
• Blueprint Trigger
• Frontend Design
• Design Drift
• Brand.md
• Design with Claude
• The Design Library
• Universal Design Principles
• Perception-First Design
• Playwright MCP
• Chrome DevTools MCP
• A11y Fixer

Nota sobre atualidade

Pesquisa concluída em 24 de julho de 2026. Marketplaces, slugs, versões, dependências, preços, permissões e compatibilidade podem mudar. Atualize os catálogos, confira a página e o repositório de cada plugin e revise Will install antes de instalar ou habilitar uma integração.