Pular pro conteúdo

Tiptap skill

O Claude coloca um editor de texto no seu app, com edição em equipe, comentários e IA, seguindo a documentação da versão do Tiptap que você usa.

por ueberdosis

instalações
3.700
estrelas no GitHub
38,9 mil
No skills.sh desde
março de 2026
Licença
MIT

Atualizada no GitHub em 23 de outubro de 2026. Dados conferidos em 26 de outubro de 2026, no skills.sh e no GitHub.

O que ela faz

Skill feita pela equipe do Tiptap, o editor de texto rico usado dentro de apps web. Antes de escrever código, o Claude identifica o framework do projeto (React, Next.js, Vue, Svelte, Nuxt) e a versão do Tiptap instalada, e lê a documentação e o código dessa versão em vez de confiar em exemplo de memória.

Cobre instalar e atualizar os pacotes (todos na mesma versão), o ajuste pra Next.js com renderização no servidor e as extensões pro, que vêm de um registro privado. Também guia a edição em tempo real com várias pessoas pelo Tiptap Cloud, o histórico de versões e o AI Toolkit, em que a IA lê, edita e comenta o documento.

Pra documentos, cobre comentários com respostas, controle de alterações (aceitar ou recusar cada edição), importar e exportar DOCX, PDF e Markdown, e layout de página com cabeçalho, rodapé e quebra de página. Busca a documentação em Markdown direto no site do Tiptap e só clona o repositório quando não tem outro jeito.

Nas palavras de quem fez

Integrate, build and debug Tiptap editors in applications. Use for Tiptap setup, installing or creating extensions, collaboration, comments, AI features, and…

ueberdosis, no SKILL.md

Quando usar

  • Colocar um editor de texto rico dentro do seu SaaS ou da sua área de membros
  • Deixar duas ou mais pessoas editarem o mesmo documento ao mesmo tempo
  • Adicionar comentários e controle de alterações num sistema de revisão de textos
  • Exportar o que foi escrito no app pra Word ou PDF
  • Consertar um editor Tiptap que quebra no Next.js

Depois de instalar, é só pedir assim

  • Coloca um editor Tiptap na página de criar post do meu app Next.js
  • Adiciona edição em tempo real no editor, pra duas pessoas escreverem no mesmo documento
  • Faz um botão pra exportar o texto do editor em DOCX

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

  • Gen Agent Trust HubPassou
  • SocketPassou
  • SnykPassou

Perguntas

Como instalar a Tiptap no Claude Code?

Toca em Levar, aqui nesta página, e deixa seu nome, e-mail e WhatsApp (é uma vez só). Aparece uma frase pronta: cola ela no Claude Code, que ele mesmo instala a Tiptap, e a skill passa a valer na próxima conversa. A mesma frase serve no Codex. Se preferir fazer na mão, o passo a passo está em como instalar skills no Claude Code.

O que precisa pra funcionar?

Um projeto web com Node.js e o git instalado. O editor básico é grátis e sai pelo npm. Edição em tempo real, comentários, histórico de versões e boa parte da IA usam o Tiptap Cloud ou extensões pro, que pedem conta no Tiptap; comentários, histórico e parte do AI Toolkit exigem plano pago, com teste grátis.

O que ela não faz?

Não serve pra contribuir com o código do próprio Tiptap nem pra outras partes do app que não envolvem o editor. Também deixa de fora as extensões de IA antigas que o Tiptap aposentou (AI Agent, AI Suggestion, AI Assistant) e ajuda a migrar quem ainda usa.

Roda no Codex e no Antigravity?

Sim. São instruções em texto que mandam ler a documentação e o código instalado; qualquer assistente que lê e edita o projeto aproveita.

Levar essa skill

1x tiptapR$ 0,00

TotalR$ 0,00

A skill sai aqui mesmo, na hora. Seus dados eu uso pra falar com você sobre o MazyOS.

Levar precisa do JavaScript ligado. O código da skill está no GitHub: github.com/ueberdosis/tiptap

Aprenda a usar