Rich text editor demo and examples

Type or paste into the live editor, try the default toolbar, then select Show HTML output to inspect your document. Choose a focused example below to test the workflow your application needs.

This example does not save your document. Copy any work you want to keep before refreshing or switching demos.

AI ToolkitStructured JSONJavaScript API

This editor instance uses the default RichTextEditor toolbar configuration.

From here, you can move into AI-assisted editing, review workflows, structured JSON, Markdown conversion, and the wider JavaScript API surface.

RichTextEditor screenshot

Try AI ToolkitTry Structured JSONExplore API demo

Editor loading

The HTML output action will be available when the editor is ready.

Choose an example for your task

Paste without formattingTry plain-text paste and see the pasteMode configuration.Upload imagesExplore the upload workflow before connecting your own server.Edit tablesTry table editing with your document content.Export a Word documentTest DOCX output with the content you need to export.

Use the editor in your application

Start with the quick-start guide or download a framework example. Editing content, storing documents, and uploading images are separate integration steps. Connect your own storage and authorization before using the editor with customer data.

Demo Code

<link rel="stylesheet" href="/richtexteditor/rte_theme_default.css" />
<script type="text/javascript" src="/richtexteditor/rte.js"></script>
<script type="text/javascript" src='/richtexteditor/plugins/all_plugins.js'></script>
<div id="div_editor1">
    <p>This editor instance uses the default RichTextEditor toolbar configuration.</p>
    <p>From here, you can move into AI-assisted editing, review workflows, structured JSON, Markdown conversion, and the wider JavaScript API surface.</p>
    <p><img src='/images/editor-image.png' alt='RichTextEditor screenshot' /></p>
</div>

<script>
    var editor1 = new RichTextEditor("#div_editor1");
</script>