랭킹으로 돌아가기

JiHong88/suneditor

JavaScriptsuneditor.com

A lightweight and powerful WYSIWYG editor in vanilla JavaScript. No dependencies.

rich-text-editorcontenteditablehtml-editoreditorno-dependenciessuneditorvanilla-javascriptweb-editor
스타 성장
스타
2k
포크
345
주간 성장
이슈
4
5001k1.5k
2023년 1월2024년 3월2025년 5월2026년 7월
아티팩트npmnpm install suneditor
README

SunEditor

A lightweight and powerful WYSIWYG editor built with vanilla JavaScript

GitHub License npm npm weekly downloads jsDelivr CDN Test coverage

SunEditor supports all modern browsers without dependencies or polyfills.

🌟 Why SunEditor?

SunEditor is a lightweight, fast, and extensible WYSIWYG editor written in pure JavaScript.
It's easy to integrate, highly customizable, and built for modern web applications.

⚡ Key Features

  • No dependencies — Optimized for speed and simplicity
  • Modular architecture — Enable only the plugins you need
  • Responsive UI — Works smoothly on all modern devices
  • Framework-friendly — Easy to use with React, Vue, Svelte, etc.
  • Feature-rich plugin ecosystem, including:
    • @Mentions with autocomplete
    • Advanced table editing & custom layouts
    • Math (LaTeX), drawing, and code block support (with language selector)
    • Markdown view mode (GFM) — edit content as Markdown
    • Built-in media galleries (image, video, audio, file)
    • PDF export, templates, and embedded content (audio/video/iframe)

📝 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

Contributions welcome! Please refer to Contribution Guidelines and check out our open tasks. ⭐


🌍 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.

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

📘 Learn how to build your own plugin →

🤖 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


📄 License

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

관련 저장소
slab/quill

Quill is a modern WYSIWYG editor built for compatibility and extensibility

TypeScriptnpmBSD 3-Clause "New" or "Revised" Licenseeditorrich-text-editor
quilljs.com
47.2k3.7k
basecamp/trix

A rich text editor for everyday writing

JavaScriptnpmMIT Licenserich-text-editorwysiwyg-editor
trix-editor.org
20k1.1k
ether/etherpad

Etherpad: A modern really-real-time collaborative document editor.

TypeScriptnpmApache License 2.0etherpadcollaboration
etherpad.org
18.5k3k
ether/etherpad-lite

Etherpad: A modern really-real-time collaborative document editor.

TypeScriptnpmApache License 2.0etherpadcollaboration
docs.etherpad.org
17.2k2.9k
tinymce/tinymce

The world's #1 JavaScript library for rich text editing. Available for React, Vue and Angular

TypeScriptnpmOtherjavascripteditor
tiny.cloud
16.3k2.3k
yabwe/medium-editor

Medium.com WYSIWYG editor clone. Uses contenteditable API to implement a rich text solution.

JavaScriptnpmOthermedium-editorcontenteditable
yabwe.github.io/medium-editor/
16.1k1.8k
jaredreich/pell

📝 the simplest and smallest WYSIWYG text editor for web, with no dependencies

JavaScriptnpmMIT Licensecontenteditableeditor
12.1k548
Milkdown/milkdown

🍼 Plugin driven WYSIWYG markdown editor framework.

TypeScriptnpmMIT Licensemarkdownmarkdown-editor
milkdown.dev
11.7k533
ckeditor/ckeditor5

Powerful rich text editor framework with a modular architecture, modern integrations, and features like collaborative editing.

JavaScriptnpmOtherckeditor5ckeditor
ckeditor.com
10.4k3.7k
TypeCellOS/BlockNote

A React Rich Text Editor that's block-based (Notion style) and extensible. Built on top of Prosemirror and Tiptap.

TypeScriptnpmOtherblock-basededitor
blocknotejs.org
10k754
zenoamaro/react-quill

A Quill component for React.

JavaScriptnpmMIT Licensereactquill
zenoamaro.github.io/react-quill
7k943
toeverything/blocksuite

🧩 Content editing tech stack for the web - BlockSuite is a toolkit for building editors and collaborative applications.

TypeScriptnpmMozilla Public License 2.0blockcollaboration
blocksuite.io
5.9k559