A highly customizable, feature-rich text editor for React applications. Built on TipTap with modern UI, dark mode support, and extensive formatting options for professional content creation.
Everything you need for professional content creation, from basic formatting to advanced features.
Complete text formatting with bold, italic, underline, strikethrough, superscript, subscript, and color options.
Organize content with various list types, headings, and structural elements for better readability.
Perfect for technical documentation with syntax highlighting and inline code support.
Create and manage complex tables with resizable columns and professional styling.
Embed images and links seamlessly with drag-and-drop support and URL validation.
Fully responsive design with built-in dark mode support for better user experience.
Experience the editor firsthand. Try all features in this live demo environment.
Try bold, italic, underline, colors, and alignment options from the toolbar.
Add links and images using the toolbar buttons or keyboard shortcuts.
Create structured content with tables, bullet lists, and task lists.
Get started in minutes with your preferred package manager.
npm install @nishant_verma/rich-editor
yarn add @nishant_verma/rich-editor
pnpm add @nishant_verma/rich-editor
import React, { useState } from 'react';
import { RichEditor } from '@nishant_verma/rich-editor';
function MyComponent() {
const [content, setContent] = useState('');
return (
<RichEditor
content={content}
onUpdate={(editor) => setContent(editor.getHTML())}
placeholder="Start writing..."
editable={true}
/>
);
}