Rich Text Editors
WYSIWYG, block-based, and markdown editors for the browser.
This is one of the deepest categories in the JS ecosystem. The right choice depends on whether you're building a Notion-style block editor, a Google-Docs-style document, a comment box, or a markdown editor.
ProseMirror-based (most popular foundation)
- ★ Tiptap — by far the most popular ProseMirror wrapper. Headless, extensible, large ecosystem of extensions (tables, mentions, collab, AI). Free for the editor; some Pro extensions are paid; collab via Hocuspocus is free self-host.
- ProseMirror — the underlying library. Use directly if you want maximum control.
- Remirror — older Tiptap competitor, less active.
Lexical-based
- ★ Lexical — Meta's editor (powers Facebook comments). React-first, plugin-based, fast. Good fit for "comments" or "rich text fields" use cases.
- Plate — React + Tailwind block editor on top of Slate/Lexical (Plate v40+ supports Lexical and Slate). shadcn-style copy-paste components.
Block editors (Notion-style)
- ★ BlockNote — Notion-style, opinionated, built on Tiptap. The fastest path to a Notion-feeling editor.
- ★ Plate — block editor toolkit; very flexible, you assemble it.
- Editor.js — block editor; older but mature.
- Outstatic / GitBook OSS / AppFlowy editor — bundled into other products.
Slate-based
- Slate — react-only, very flexible, lower-level than Tiptap. Plate sits on top.
Markdown / code editors
- ★ Monaco Editor — the editor from VS Code. Best choice for code editing in a browser.
- CodeMirror 6 — modular, fast, pluggable. Underlying tech for many markdown editors.
- Milkdown — markdown editor on ProseMirror; middle ground between Tiptap and a true markdown editor.
- MDXEditor — WYSIWYG MDX editor.
- react-md-editor, Toast UI Editor — lighter markdown editors.
Specialty
- Quill — older WYSIWYG; Quill 2 is a healthy refresh.
- Trix (Basecamp) — minimalist WYSIWYG.
Pick this if…
- Default rich-text in a React app: Tiptap.
- Notion-style blocks fast: BlockNote.
- Comments / messages / Facebook-style rich input: Lexical.
- Code editing: Monaco.
- Markdown editor: CodeMirror 6 (build) or Milkdown (WYSIWYG markdown).
- You want shadcn-style copy-paste components: Plate.