
slash-editor
Notion-style block editor for React. MIT, UI you own
About slash-editor
slash-editor is an open-source, Notion-style block editor designed for React applications, providing a familiar and flexible editing experience for developers and content creators alike. Built on a headless Tiptap v3 core, it offers features such as a slash menu, drag handles, nested reordering, turn-into options, comments, and real-time collaboration. Its UI is delivered through a shadcn registry, ensuring seamless integration with Tailwind CSS, allowing developers to maintain full control over the look and feel of their app. The tool also supports advanced functionalities like tables, columns, Mermaid diagrams, markdown import/export, and AI integrations via your own models, all while being fully MIT licensed and hosted locally—no paid tiers or hosting required. slash-editor empowers teams to build highly customizable, collaborative content editing experiences within their React projects, making it ideal for SaaS products, knowledge bases, or complex documentation systems.
Screenshots





Pros
- ✓Open source with full control over the UI and data
- ✓Rich feature set including comments, drag handles, and nested reordering
- ✓Integrates with Tailwind CSS for consistent styling
- ✓Supports advanced content types like tables and diagrams
- ✓Real-time collaboration capabilities
Cons
- ✗Requires React and Tailwind CSS knowledge for setup
- ✗No built-in hosting or managed service, increasing setup complexity
- ✗Limited ecosystem or community support compared to more established editors
Use Cases
Pricing
Pricing not verified
Quick Info
Topics
Makers
Nhat Bui
Alternatives
Similar Tools in Productivity
Embed Badge
Add this badge to your website to show that slash-editor is featured on Visalytica.
<a href="https://www.visalytica.com/tool/slash-editor" target="_blank" rel="noopener noreferrer" style="display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:#7c3aed;color:#fff;border-radius:8px;font-family:-apple-system,system-ui,sans-serif;font-size:13px;font-weight:600;text-decoration:none;transition:background .2s" onmouseover="this.style.background='#6d28d9'" onmouseout="this.style.background='#7c3aed'"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20V10"/><path d="M18 20V4"/><path d="M6 20v-4"/></svg>Featured on Visalytica</a>