⚡ Zero dependencies · MIT License · v2.0.10

The free rich-text editor
your app deserves

RayEditor is a lightweight WYSIWYG editor for JavaScript, TypeScript, React, Vue, Angular, and Svelte. No commercial license. No vendor lock-in. Just drop it in and write.

Try it live Read the docs GitHub
TypeScript Slash commands Dark mode Markdown mode Task lists Callout blocks Plugin API ESM · CJS · UMD React · Vue · Angular · Svelte
What's included
Everything. Out of the box. Free.

Features locked behind paid tiers in TinyMCE and CKEditor are free in RayEditor.

Zero dependencies
Pure TypeScript — no jQuery, no lodash, no Prosemirror, no bloat
🎨
Dark mode
Light, dark, or auto (follows OS). CSS variables for full theming
⌨️
Slash commands
Notion-style / palette — type / on a blank line to insert any element
📝
Markdown mode
Bidirectional rich text ↔ Markdown. Import and export .md files
🔍
Find & Replace
Ctrl+F / Ctrl+H with match highlighting — free (paid in TinyMCE)
🔌
Plugin API
editor.use(plugin) — register commands, listen to events, add buttons
Task lists
Clickable checkbox lists. Clean data-checked HTML output
NEW v2.0.5
💬
Callout blocks
Info, warning, success, error — styled, icon-prefixed, editable
NEW v2.0.5
🔤
Special characters
90+ symbols in a popup: arrows, math, currency, Greek, punctuation
NEW v2.0.5
🖍️
Highlight
Mark text with <mark> — toggleable, dark-mode aware
NEW v2.0.5
📐
Font size picker
Popup with 12 preset sizes (10–72 px), live preview on hover, custom size input, Default to clear
UPDATED v2.0.8
📋
Paste normalization
HTML from Word, Google Docs, GitHub auto-cleaned to semantic markup
NEW v2.0.5
💡
Syntax highlighting
Code blocks highlighted via Highlight.js (lazy-loaded). JS, TS, Python, HTML, CSS, JSON, Bash
NEW v2.0.5
📊
Tables
Grid picker, floating toolbar — add/remove rows & columns, move rows, toggle header
🔗
Link new-tab toggle
Click ↗ in the link popup to toggle target="_blank" in-place — no modal needed
NEW v2.0.8
🖼️
Image upload
Upload, drag-resize, alt/title/caption editor modal
🔢
Word count
Live word & character count bar + getWordCount() API
Accessible
role="toolbar", role="textbox", aria-pressed, full keyboard navigation
📦
ESM · CJS · UMD
Modern bundlers + CDN-ready UMD exposing window.RayEditor
🧩
Framework wrappers
React, Vue 3, Angular, Svelte packages — v-model / onChange wired up
🔡
TypeScript types
Full .d.ts shipped — autocomplete in VS Code, WebStorm, etc.
Editor comparison
Why RayEditor?

The only free, open-source WYSIWYG HTML editor with slash commands, markdown mode, task lists, callouts, find/replace, and a plugin API — all in one package. A lightweight alternative to TinyMCE, Quill, and CKEditor that works with React, Vue, Angular, and Svelte.

FeatureRayEditorTinyMCE (free)Quill.jsCKEditor 5Trix
Zero dependencies
TypeScript types
Dark mode (free)
Slash commands
Markdown mode
Find & Replace (free)
Task lists
Callout blocks
Paste normalization
Plugin / Extension API
Tables (free)
Word count (free)
Mention (@) support
MIT License❌ GPLv2
React / Vue / Angular / Svelte