Question 1

How do I add a custom toolbar in Tiptap?

Accepted Answer

You need to build it from scratch using custom extensions or existing ones. The README points to UI templates and documentation for custom extensions to guide the design and implementation.

Question 2

Tiptap vs Draft.js: which is better for React?

Accepted Answer

Tiptap is headless and framework-agnostic, offering more customization and collaboration features, while Draft.js is React-specific with a built-in UI but less flexible. Choose Tiptap for full control, Draft.js for quicker setup.

Question 3

Is Tiptap free for commercial use?

Accepted Answer

Yes, the core editor and many extensions are open-source under MIT license and free. However, advanced Pro Extensions like AI or versioning require a paid subscription, as noted in the README.

Question 4

How to set up real-time collaboration with Tiptap?

Accepted Answer

Use the open-source Hocuspocus backend integrated with Yjs. The README provides a CodeSandbox example and documentation for implementing collaborative editing in your application.

Question 5

Does Tiptap support markdown input?

Accepted Answer

Yes, through community or custom extensions. You can add markdown parsing and serialization capabilities, though it's not built-in by default and requires extension setup.

Question 6

What's the bundle size of Tiptap?

Accepted Answer

Tiptap is built on ProseMirror and can have a larger bundle size due to extensions. For performance-sensitive apps, you should tree-shake and selectively import only needed extensions to optimize.

tiptap

What is tiptap?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions