HTML WYSIWYG editor
Edit rich text in the browser with a toolbar for bold, italic, strikethrough, inline code, headings, lists, quotes, code blocks, undo and redo — and inspect or copy the generated HTML at any time.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Editor
Select text first, then click a toolbar button. Everything runs locally.
UniKit 富文本编辑器
直接在这里输入内容，选中文字后可以用工具栏设置 加粗、斜体、删除线 或 行内代码。
所有内容都留在浏览器里，不会上传到任何服务器。
- 标题支持 H1 到 H4
- 支持有序列表、无序列表与代码块
- 可以随时复制生成的 HTML 源码
HTML source
<h2>UniKit 富文本编辑器</h2><p>直接在这里输入内容，选中文字后可以用工具栏设置 <strong>加粗</strong>、<em>斜体</em>、<s>删除线</s> 或 <code>行内代码</code>。</p><blockquote><p>所有内容都留在浏览器里，不会上传到任何服务器。</p></blockquote><ul><li>标题支持 H1 到 H4</li><li>支持有序列表、无序列表与代码块</li><li>可以随时复制生成的 HTML 源码</li></ul>
Document stats
What this tool does
- Write an email, Markdown note or survey answer with bold, lists and headings without hand-writing HTML tags, then copy the generated source.
- Paste existing rich text from a web page into the editor to strip its original formatting and restyle it cleanly.
- Prepare an HTML fragment for a CMS or email template and copy the contents of the "HTML source" pane when you are done.
- Gauge the length of your copy: the document stats report words, characters (with and without spaces) and the block element count.
Example
Input
<h2>UniKit editor</h2><p>Hello <strong>world</strong> & more</p>
Output
UniKit editor Hello world & more
The "plain text" pane strips tags, decodes entities and joins blocks with a space; the block count for this snippet is 2. Writing the input as HTML is only for readability here — in real use you type into the contenteditable area and the tool emits the HTML.
Frequently asked questions
Is my content uploaded to a server?
No. The editor is built on the browser contenteditable API and document.execCommand, so everything happens in local memory: no requests are made and no draft is stored. A page reload loses the content, so copy the HTML source first if it matters.
Why does clicking a toolbar button do nothing?
Most commands (bold, italic, headings, lists) need a text selection first. With nothing selected they apply to whatever you type next, which looks like a no-op. "Inline code" inserts a <code> pair, so it also expects a selection.
Is the copied HTML safe to publish?
The editor itself only emits formatting tags, but if you paste content carrying <script>, on* handlers or javascript: links it warns you about the risk. Treat the result as untrusted anyway and escape it or run it through an allow-list on the server.
Why does the plain text pane lose my line breaks?
The plain text view joins block content with single spaces so the copy reads as one paragraph and word counting stays simple. Switch to the HTML source pane when you need the paragraph structure.
Does it support H1 through H6?
The toolbar exposes H1–H4 (formatBlock with H1/H2/H3/H4); quote and code block map to <blockquote> and <pre>. For deeper heading levels, copy the source and adjust it by hand.
Keywords：wysiwyg所见即所得富文本html editorcontenteditable文档编辑编辑器rich text