nhn/tui.editor

TOAST UI Editor is a text editor component you can embed in a web application to let users write and edit content using Markdown. Markdown is a lightweight way of formatting text using simple symbols, for example, putting asterisks around a word makes it bold, that gets converted into formatted HTML when displayed. The editor supports two modes you can switch between at any time. Markdown mode shows the raw Markdown syntax alongside a live preview of how it will look when rendered, with scroll synchronization so both sides stay in step. WYSIWYG mode (What You See Is What You Get) hides the Markdown symbols and shows the formatted result directly, letting users edit in a more word-processor-like environment. It follows the CommonMark and GFM (GitHub Flavored Markdown) specifications, meaning documents written here will display correctly wherever those standards are supported. The editor ships with a plugin system that extends what Markdown can express. Included plugins let you render charts from data in code blocks, display UML diagrams (flowcharts and sequence diagrams), highlight code syntax in multiple programming languages, apply text colors using a color picker, and merge table cells. The editor also supports internationalization, it comes with translations for many languages, and has a dark theme option. The core component is written in TypeScript and plain JavaScript, with wrapper packages available for React and Vue, making it straightforward to drop into most modern front-end projects. You would use this if you are building a documentation site, a content management tool, a note-taking app, or any web product where users need rich text editing with Markdown support.