Skip to content
JiHong88Public

About

A modular WYSIWYG HTML editor with zero runtime dependencies. Everything included, enable only what you need.

Topics

Resources

Contributing

Security policy

Stars

2.0k stars

Watchers

30 watching

Forks

Latest commit

 

History

4,473 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SunEditor

A modular WYSIWYG HTML editor with zero runtime dependencies.
Everything included. Enable only what you need.

GitHub License npm npm monthly downloads jsDelivr CDN Test coverage

Live Playground · Documentation · Get Started · Frameworks

  • Tables, images, video, audio and files — resize, align, captions, galleries and uploads built in
  • Markdown, math and code blocks — GFM Markdown view, LaTeX math, code blocks with a language selector
  • Slash commands and block handles — / command menu, drag handles to move blocks
  • Mentions, find & replace, templates, PDF export, drawing — and more, as opt-in plugins
  • TypeScript — bundled type definitions for options, plugins and the public API
  • Works with any framework — React, Vue, Angular, Svelte or plain HTML
  • MIT License — free for commercial use, no account or cloud service required
  • Zero runtime dependencies — no polyfills, no peer dependencies

🤔 Need an editor, not an editor framework?

Headless editor frameworks (Tiptap, Lexical, ProseMirror) give you an engine and leave the toolbar, dialogs, tables and media handling for you to build. That is the right choice when the editor is your product.

SunEditor is for the other case: you need a complete HTML editor in a CMS, admin panel, back office, board, product description or email form — and you need it today.

SunEditor Headless editor framework
Toolbar, dialogs, menus Built in You build them
Tables, images, media, files Built in Extensions + your own UI
Output HTML Document model (HTML via a serializer)
First working editor One create() call Engine setup + your own UI
Best for CMS, admin, back office, forms Notion-like or highly custom editors

When SunEditor is not the best fit: Notion-like block products, deeply custom node UIs, or collaboration-first editors are better served by Tiptap or Lexical. Enterprise document workflows that need comments, track changes and vendor support are better served by CKEditor.

📝 Content Editing Approach

SunEditor is optimized for structured content (articles, documentation, emails) rather than arbitrary HTML editing. Content is validated and auto-corrected to maintain consistency.

For raw HTML editing needs, see strictMode configuration in the Architecture Guide.

🌤 Try all plugins in Playground

⭐ If SunEditor saves you time, a GitHub star helps other developers find it.

🤝 Contributions welcome! See the Contribution Guidelines and the good first issue / help wanted issues.


🌍 Browser Support

SunEditor is built to take advantage of modern browser capabilities.
It does not ship with polyfills by default, but you can add them if your project requires broader compatibility.

Works correctly on the following versions or newer.

Browser ≥ Version
Chrome 119 (Oct 2023)
Edge 119 (Nov 2023)
Firefox 125 (Apr 2024)
Safari (macOS, iOS) 17.2 (Dec 2023)
Opera 105 (Nov 2023)
Android WebView 119 (Oct 2023)
Samsung Internet 23.0 (Oct 2023)
Firefox ESR 128 (Jul 2024)

❌ Not Supported : IE, Legacy Edge

📌 Why This Baseline? (Late 2023)

  • This is based on features commonly supported by modern browsers.
  • Most modern web APIs and CSS features are supported reliably in versions after this point.
  • Unless specific compatibility issues arise, you can use it out of the box without additional polyfills.
  • If you need support for older browsers, you can extend it by adding your own polyfills.

📦 Legacy Version (v2-legacy)

* Supported IE11

SunEditor v3 is the latest version.
This section refers to the previous stable version, SunEditor v2.

The v2-legacy branch is no longer actively maintained,
but still available for compatibility with older projects.

👉 v2-legacy branch


🚀 Install & Quick Start

💡 Want to see it in action?
Check out the 🌤 Live Demo 🌤 with full options and examples.

NPM

npm install suneditor --save
import 'suneditor/css/editor'; // Editor UI
import 'suneditor/css/contents'; // For displaying HTML
import suneditor from 'suneditor';

// HTML: <div id="editor"></div> or <textarea id="editor"></textarea>
suneditor.create(document.querySelector('#editor'), {
	// options
});

CDN (jsDelivr)

<script src="https://cdn.jsdelivr.net/npm/suneditor@latest/dist/suneditor.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/suneditor@latest/dist/suneditor.min.css" rel="stylesheet" />
<!-- Optional language (default is English): e.g., Korean (ko) -->
<!-- <script src="https://cdn.jsdelivr.net/npm/suneditor@latest/src/langs/ko.js"></script> -->

<div id="editor"></div>
<!-- or <textarea id="editor"></textarea> -->

<script>
	SUNEDITOR.create(document.querySelector('#editor'), {
		// options
	});
</script>

🔧 Framework Integration

You can use the official wrappers for easier integration:

React – suneditor-react
Vue – suneditor-vue


📦 Plugins

SunEditor supports a plugin-based architecture.
You can enable only the plugins you need or even create your own custom ones.

Pass the plugins you want as an array of plugin classes:

import suneditor from 'suneditor';
import { font, image, video } from 'suneditor/plugins';

suneditor.create('#editor', {
	plugins: [font, image, video],
	image: {
		uploadUrl: 'https://upload.image',
	},
});

An object keyed by plugin name works too, and excludedPlugins lets you drop individual plugins when you enable the whole set:

import plugins from 'suneditor/plugins';

suneditor.create('#editor', {
	plugins, // every built-in plugin
	excludedPlugins: ['image', 'video'],
});

📘 Learn how to build your own plugin →

Community plugins

Package Naming Published by
Official @suneditor/<name> (e.g. @suneditor/plugin-mermaid) The suneditor organization only
Community suneditor-plugin-<name> or @<your-scope>/suneditor-plugin-<name> Anyone

Add the suneditor and suneditor-plugin keywords so others can find your plugin, and share it in Discussions → Show and tell.

🤖 Want to build plugins? Get real-time help from SunEditor Devs AI.
See Contribution Guide for tips and examples.


✨ Contributors

contributors

💎 Sponsors

Backers

Backers on Open Collective

Sponsors

Sponsors on Open Collective


🔒 Security

SunEditor sanitizes HTML on input, paste and Code View, and an XSS regression corpus runs with the unit test suite in CI. Please report vulnerabilities privately — see the Security Policy.


📄 License

SunEditor is an open-source project available under the MIT License.

About

A modular WYSIWYG HTML editor with zero runtime dependencies. Everything included, enable only what you need.

Topics

Resources

Contributing

Security policy

Stars

2.0k stars

Watchers

30 watching

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages