✦ Felipe Tâmbara · @felipetambara.ia

Central de Material

Todo material que eu entrego nos meus conteúdos, num lugar só. Escolhe o tema e resgata o passo a passo.

Os 5 plugins pro Claude Code parar de entregar tela feia
Resgatar material →

Os 5 plugins pro Claude Code parar de entregar tela feia

O guia de instalação dos 5 plugins do vídeo (mais o 21st MCP de bônus): o que cada um faz, o comando exato pra instalar no Claude Code, conferido no repositório oficial, e a ordem em que eles trabalham juntos num projeto de front.

As 6 da semana em IA (e por que a China é o assunto)
Resgatar material →

As 6 da semana em IA (e por que a China é o assunto)

As 6 coisas que saíram essa semana e valem seu tempo, na mesma ordem do vídeo: 3 modelos abertos que rodam na sua máquina, um time de agentes com computador próprio e 2 skills open source pra usar no Claude Code hoje. Com o link de cada uma.

A lista de leads que o Claude monta sozinho
Resgatar material →

A lista de leads que o Claude monta sozinho

O scraper open source que deixa o Claude varrer a web, puxar o contato público das empresas do seu nicho e devolver tudo numa planilha limpa. Roda na sua máquina, com modelo local, sem assinatura de scraper.

✦ Felipe Tâmbara

Os 5 plugins que o Claude Code deveria já vir instalado

Resgatar material →

Os 5 plugins que o Claude Code deveria já vir instalado

Limite de uso que não trava, memória entre sessões, metade do gasto de token, setup auditado pela própria Anthropic e uma skill que melhora as suas outras skills sozinha. Com o comando de instalação de cada um, na ordem.

A alternativa grátis ao ElevenLabs que clona sua voz com 3 segundos
Resgatar material →

A alternativa grátis ao ElevenLabs que clona sua voz com 3 segundos

Clone de voz, dublagem de vídeo, ditado e audiolivro em 646 idiomas, rodando na sua máquina, sem conta, sem API key e sem mensalidade. Com servidor MCP pra plugar no Claude Code.

Os 5 cursos com certificado grátis
Resgatar material →

Os 5 cursos com certificado grátis

Os links diretos dos 5 cursos do carrossel, quanto tempo cada um leva de verdade, e como sair com o certificado sem pagar nos dois que parecem pagos.

A skill que tira a cara de IA de qualquer texto
Resgatar material →

A skill que tira a cara de IA de qualquer texto

33 padrões de escrita de IA catalogados pela Wikipedia, virados numa skill que funciona em qualquer agente. Como instalar, como calibrar com a sua própria voz, e a lista completa do que ela caça.

Um modelo de 2,78 trilhões de parâmetros rodando num CPU com 8 GB de RAM
Resgatar material →

Um modelo de 2,78 trilhões de parâmetros rodando num CPU com 8 GB de RAM

O motor de inferência em C que roda o Kimi K3 sem GPU, sem framework e sem CUDA, num binário de 176 KB. Aqui está como ele faz isso, o teste que você roda em um minuto sem baixar nada, e o caminho completo se quiser ir até o fim.

O modelo de 550B da NVIDIA rodando de graça no seu terminal
Resgatar material →

O modelo de 550B da NVIDIA rodando de graça no seu terminal

Como conectar a API hospedada da NVIDIA ao OpenCode e usar o Nemotron 3 Ultra como agente de código, sem GPU nenhuma. Passo a passo, o arquivo de configuração completo, e o que muda quando o endpoint gratuito acabar.

As 15 ferramentas de IA, categoria por categoria
Resgatar material →

As 15 ferramentas de IA, categoria por categoria

A lista fechada do vídeo: 15 ferramentas em 12 categorias, o que cada uma resolve de verdade, em que momento ela entra e o link de todas. Com a fonte original aberta no fim, incluindo o PDF e as 47 do site.

As 15 IAs de graça do Google
Resgatar material →

As 15 IAs de graça do Google

A lista completa com o link de todas as 15, o que cada uma faz de verdade, quais valem o seu tempo e por qual começar dependendo do que você faz.

O estúdio de vídeo e imagem com IA que roda no seu PC
Resgatar material →

O estúdio de vídeo e imagem com IA que roda no seu PC

Open Generative AI: um repositório open source que junta mais de 400 modelos de imagem, vídeo, áudio e lip sync numa interface só. Instala em um clique e tem um caminho que roda sem chave de API nenhuma.

As aulas de IA que o Google liberou de graça
Resgatar material →

As aulas de IA que o Google liberou de graça

O mapa das 17 aulas do AI Boost Bites: o que cada uma ensina, por onde começar e os prompts pra aplicar no mesmo dia. Direto do Google Skills, com badge oficial no fim de cada uma.

As regras de design da Apple viraram uma skill do Claude Code
Resgatar material →

As regras de design da Apple viraram uma skill do Claude Code

A skill apple-design destila as talks de design da Apple e traduz pra web. Aqui está como instalar, o prompt que audita o site que você já tem, e os números concretos que ela carrega dentro.

As 25 trocas: ferramenta paga que tem versão grátis
Resgatar material →

As 25 trocas: ferramenta paga que tem versão grátis

A lista completa do carrossel, com o link direto de cada alternativa gratuita e o que ela entrega de verdade. Mais o teste de uma semana que decide o que você cancela e o que continua valendo a pena pagar.

Os servidores MCP que valem instalar (e o que evitar)
Resgatar material →

Os servidores MCP que valem instalar (e o que evitar)

MCP é o USB-C da IA: um padrão só que pluga o Claude em qualquer ferramenta. Separei os que valem instalar primeiro, por perfil, com o comando de instalação de cada um.

O Prompt da Verdade
Resgatar material →

O Prompt da Verdade

Uma instrução que você cola uma vez nas configurações do Claude, ChatGPT ou Gemini e força a IA a separar fato de chute, e avisar quando não sabe.

As 5 skills de animação pro Claude Code
Resgatar material →

As 5 skills de animação pro Claude Code

Os repositórios que dão pro Claude Code o contexto certo de cena 3D, timeline, motion design e acabamento visual. Links diretos, é só clonar e usar.

O repositório com 100+ agentes de IA prontos pra copiar
Resgatar material →

O repositório com 100+ agentes de IA prontos pra copiar

128 mil estrelas, licença Apache 2.0 e mais de 100 agentes, skills e apps de RAG testados de ponta a ponta. Você clona, roda em 4 comandos e pode usar comercialmente, sem construir nada do zero.

O router grátis que acaba com o rate limit do seu Claude Code
Resgatar material →

O router grátis que acaba com o rate limit do seu Claude Code

Um gateway open source que conecta Claude Code, Cursor, Codex e Cline a mais de 60 provedores de IA com fallback automático: sua assinatura acaba, ele troca sozinho pro plano barato ou de graça e você nunca para de codar.

O plugin que audita seu Claude Code e recomenda o setup certo
Resgatar material →

O plugin que audita seu Claude Code e recomenda o setup certo

Plugin oficial da Anthropic que lê o seu projeto e devolve as automações (hooks, skills, subagents, MCPs) que fazem sentido pro SEU código. Só análise, não mexe em nada.

As 3 camadas do CLAUDE.md
Resgatar material →

As 3 camadas do CLAUDE.md

Computer, Project e Folder: os arquivos que fazem o Claude parar de esquecer como você trabalha, sessão após sessão. Com os 3 templates reais pra copiar e o prompt que preenche sozinho.

O loop que economiza o Fable 5
Resgatar material →

O loop que economiza o Fable 5

Como usar o modelo mais forte do Claude (Fable 5 ou Opus 4.8) só pra planejar e revisar, enquanto um subagente barato faz o trabalho pesado, sem estourar o limite de uso.

O playbook de segurança com IA
Resgatar material →

O playbook de segurança com IA

3 prompts prontos pra vetar skills antes de instalar, travar suas chaves de API e criar guardrails antes de conectar qualquer ferramenta na sua IA.

5 usos insanos do Fable 5
Resgatar material →

5 usos insanos do Fable 5

Os 5 usos do Fable 5 (o modelo mais forte do Claude) que eu já testei essa semana, com os prompts prontos pra copiar e colar.

As 5 skills que transformam o Claude Code numa máquina
Resgatar material →

As 5 skills que transformam o Claude Code numa máquina

O Claude Code tem mais de 100 mil skills, mas são essas 5 que fazem a diferença de verdade. Com o repositório oficial e o comando de instalação de cada uma.

O estúdio de voz com IA que roda de graça na sua máquina
Resgatar material →

O estúdio de voz com IA que roda de graça na sua máquina

Clona qualquer voz, gera fala em 23 idiomas e dita em qualquer app, tudo rodando local e open source. Substitui o ElevenLabs e o Whisperflow sem mensalidade.

As 42 skills que consertam o design do Claude
Resgatar material →

As 42 skills que consertam o design do Claude

Por padrão o Claude entrega design genérico. Pluga as skills certas e ele vira uma máquina de UI impecável. Aqui estão as 42, em 6 camadas, com o comando de instalação de cada uma.

A planta do seu segundo cérebro
Resgatar material →

A planta do seu segundo cérebro

Junta a inteligência do Claude com o vault conectado do Obsidian: pensa mais fundo, conecta melhor e executa mais rápido.

✕ Fechar

✦ Felipe Tâmbara · IA na prática

O Claude Code desenha tela feia. Cinco plugins e ele vira designer

1

Antes de instalar

Os 5 usam o mesmo instalador, então é 1 comando pra aprender

A ideia: O Claude Code escreve código bom e desenha tela genérica porque ninguém deu gosto pra ele. Cada plugin abaixo resolve um pedaço: referência de design premium, regra oficial de auditoria, design system pronto, imagem virando código e um navegador pra ele mesmo conferir o que fez. Instala os 5 e o front sai com cara de produto, não de vibe code.
O instalador que vale pra quase todos: Quatro dos cinco são skills e instalam com o npx skills add (da Vercel). Ele baixa a skill pra pasta do projeto ou global e o Claude Code passa a usar sozinho quando a tarefa combina. Precisa de Node 18+ instalado. O quinto (Playwright CLI) é um pacote global do npm.
Cola no Claude Code · instala os 5 de uma vez
Instala esses 5 plugins de design no meu Claude Code, nessa ordem, e me mostra cada comando antes de rodar:

1. Taste Skill: npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
2. Web Design Guidelines: npx skills add vercel-labs/agent-skills
3. Awesome Design: clona https://github.com/VoltAgent/awesome-design-md numa pasta ~/design-md pra eu escolher um DESIGN.md depois
4. Image to Code: npx skills add https://github.com/Leonxlnx/taste-skill --skill "image-to-code"
5. Playwright CLI: npm install -g @playwright/cli@latest e depois playwright-cli install --skills

No fim roda /skills (ou lista as skills instaladas) e me confirma quais ficaram ativas.
2

1 · Taste Skill

Puxa gosto de design de referência premium pro seu projeto

O que faz: Skill que lê o briefing, infere a linguagem de design e ajusta três dials (variação de layout, movimento, densidade) antes de escrever uma linha. A v2 traz mapa de design system, esqueletos de animação em GSAP e uma checagem pré-entrega que barra o layout genérico. Funciona no Claude Code, Codex, Gemini CLI e afins.
Cola no terminal · instalar
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
  1. AO repositório tem mais de uma skill. O comando acima instala só a principal. Vale olhar a high-end-visual-design (UI calma e cara) e a redesign-existing-projects (pra projeto que já existe e está feio).
  2. BJá tinha a v1? Roda o mesmo comando e ela é substituída no lugar.
  3. CSite oficial com exemplos antes e depois: tasteskill.dev
Taste Skill no GitHubopen sourcegithub.com/Leonxlnx/taste-skill
3

2 · Web Design Guidelines (Vercel)

Audita o seu código contra as regras oficiais de design da Vercel

O que faz: Skill oficial da Vercel Labs que revisa a interface contra um checklist de mais de 100 regras: acessibilidade, foco, contraste, estados de carregamento, formulário, tipografia, responsivo. Você pede a auditoria e ela devolve a lista de pontos fracos antes de você subir.
Cola no terminal · instalar
npx skills add vercel-labs/agent-skills

Como pedir a auditoria depois de instalada

Revisa a página de checkout usando a skill web-design-guidelines e me lista o que está fora do padrão, do mais grave pro menos grave.

Uma lista objetiva (contraste baixo no botão secundário, input sem label, foco invisível no teclado...) em vez de um "ficou bom" genérico.

Vem mais coisa junto: O mesmo repositório instala também a react-best-practices (performance de React e Next.js). Não atrapalha, e é o mesmo comando.
vercel-labs/agent-skillsoficial Vercelgithub.com/vercel-labs/agent-skills/blob/main/skills/web-design-guidelines/SKILL.md
4

3 · Awesome Design (DESIGN.md)

Um design system inteiro tirado de site de primeira linha, em um arquivo

O que faz: Coleção com mais de 70 arquivos `DESIGN.md` extraídos de sites reais (Linear, Vercel, Stripe e afins): cor, tipografia, espaçamento, botão, regras de hierarquia. É o conceito do Google Stitch: um markdown na raiz do projeto que qualquer agente lê e passa a obedecer. Não é plugin que instala, é arquivo que você copia.
Cola no Claude Code · escolher e aplicar
Clona https://github.com/VoltAgent/awesome-design-md em ~/design-md. Lista os DESIGN.md disponíveis com uma linha descrevendo o estilo de cada um. Quando eu escolher, copia o arquivo pra raiz deste projeto como DESIGN.md e, daqui pra frente, toda tela que você construir aqui segue ele.
  1. ARegra de ouro: um DESIGN.md por projeto. Misturar dois vira a mesma sopa de antes.
  2. BPra cliente: pede um DESIGN.md do site que ele gosta (o próprio repositório aceita pedido em getdesign.md) e começa o projeto já com a identidade travada.
  3. CCombina com o Taste: o Taste dá o gosto, o DESIGN.md dá a regra. Juntos param de brigar com a sua vontade.
awesome-design-md no GitHub70+ design systemsgithub.com/VoltAgent/awesome-design-md
5

4 · Image to Code

Joga a referência de tela e ele devolve código sem perder detalhe

O que faz: Skill do mesmo pacote do Taste, com pipeline imagem primeiro: gera ou recebe a referência visual, analisa seção por seção (hero, cards, tipografia, espaçamento) e só então implementa o front pra bater com a imagem. Tem regra explícita contra "card dentro de card dentro de card" e contra hero que não cabe num notebook pequeno.
Cola no terminal · instalar
npx skills add https://github.com/Leonxlnx/taste-skill --skill "image-to-code"

Como usar com um print

Usa a skill image-to-code: aqui está o print da landing que eu quero como referência (arrasta a imagem). Reconstrói a seção hero e a de preços em React + Tailwind, fiel ao espaçamento e à tipografia, e troca o conteúdo pelo da minha oferta.

Código que parece a referência, não uma versão genérica dela. Os detalhes que o Claude costuma perder (peso de fonte, respiro, alinhamento) ficam.

image-to-code no GitHubopen sourcegithub.com/Leonxlnx/taste-skill/blob/main/skills/image-to-code-skill/SKILL.md
6

5 · Playwright CLI (Microsoft)

O Claude abre o navegador, printa o que construiu e pega o erro antes de você

O que faz: Ferramenta oficial da Microsoft que dá ao Claude Code um navegador de verdade por linha de comando: abre a página, tira screenshot, clica, preenche, lê o console. O ganho real é o loop fechado: ele constrói, olha o resultado, vê a tela quebrada ou o erro no console, e corrige sozinho, em vez de te entregar no escuro.
Cola no terminal · instalar + ativar a skill
npm install -g @playwright/cli@latest
playwright-cli install --skills
  1. AO segundo comando importa: é ele que instala a skill que ensina o Claude Code a usar o navegador. Sem ele, você tem o binário e o Claude não sabe que ele existe.
  2. BPra conferir o próprio trabalho: depois de construir, pede "abre localhost:3000 no playwright-cli, printa em desktop e em 390px de largura e corrige o que estiver quebrado".
  3. CSite logado: playwright-cli attach --cdp=chrome gruda no seu Chrome aberto e aproveita a sessão.
microsoft/playwright-clioficial Microsoftgithub.com/microsoft/playwright-cli
7

Bônus · 21st MCP

Componentes prontos de UI direto no chat, estilo v0

O que é: Servidor MCP do 21st.dev: você descreve o componente ("um pricing com 3 planos e toggle mensal/anual") e ele devolve um componente React pronto, inspirado na biblioteca deles. Não estava na fala do vídeo, mas veio na lista original de links, então fica aqui.
Cola no terminal · instalar no Claude Code
npx @21st-dev/cli@latest init --client claude
Duas pegadinhas: Precisa de chave de API (grátis pra começar) em 21st.dev/mcp. E o antigo Magic MCP foi substituído por este: se você tem config velha do @21st-dev/magic, as chaves antigas foram zeradas, gera uma nova.
21st MCPprecisa de chavegithub.com/21st-dev/magic-mcp
8

A ordem em que eles trabalham juntos

Instalar é fácil. O resultado vem da sequência

  1. A1. DESIGN.md na raiz (Awesome Design): trava a identidade antes de qualquer tela.
  2. B2. Taste ligado: ele lê o brief e o DESIGN.md e decide a linguagem.
  3. C3. Referência de tela (Image to Code): quando você tem um print do que quer, começa por ele.
  4. D4. Constrói e confere (Playwright CLI): printa, acha o erro, corrige.
  5. E5. Auditoria final (Web Design Guidelines): a lista do que está fora do padrão antes de subir.
Onde a lista para: Com isso o Claude Code entrega tela que parece produto. O que os plugins não fazem é decidir o que a tela precisa vender: a ordem das seções, a oferta, o que o cliente precisa ler primeiro. Design bonito em cima de página que não converte continua sendo página que não converte.
O próximo passo: É exatamente isso que eu mostro por dentro: a página nascendo do DNA de uma referência real, com mídia gerada sob medida, passando por auditoria e indo pro ar pra cliente de verdade. Os plugins você já tem. O sistema em volta deles é o que vira faturamento.

✦ Material parado não muda nada

Pegou o passo a passo. E agora?

Material salvo que você nunca executa não muda nada. O que falta não é conteúdo, é gente construindo do seu lado. Na Core, a comunidade de builders, você aplica isso junto com quem tá fazendo o mesmo, com as aulas e o suporte pra destravar de verdade.

Conhecer comunidade →