Welcome to the online HTML editor by CKEditor! It is a versatile and comprehensive online WYSIWYG editor powered by a modern, flexible, feature-rich framework with collaborative editing delivered by CKSource written in pure JavaScript.

Real-time collaboration editor features overview

Whatever your needs are, this real-time collaboration editor with a plethora of functions and options is at hand. It offers powerful, comfortable, fast, and easy online collaborative editing experience. If there is a teamwork to be done - just invite your colleagues and send them the link for a real-time collaborative eidting feast.

Basic formatting features and text styling

Basic text styles

The basic text styles feature allows you to apply the most frequently used formatting indispensable for content creation. This package provides essential text styling features such as bold, italic, underline, strikethrough, subscript and superscript. Coupled with more formatting features, these serve as a base for any WYSIWYG editor toolset.

Use UI toolbar buttons to employ basic styles in your content - select a word or larger portion of the text to apply the formatting to and then use a toolbar button with the desired style.

Font styles

The font feature provides extended text formatting options for the document content. It enables the following features in the rich-text editor: change the font family, control the font size, control the font color and control the font background color.

Use UI toolbar buttons to employ change the font size, font face, font color or background color of selected content. Apply selected style to single words or whole passages.

Remove formatting

The remove format feature allows the formatting to be removed with a single click of a toolbar button. Use it to reset font face or color, remove bolding or italics and to restore default alignment of content.

Layout and structure

Block formatting and text operations can be employed to provide rich-text editing experience.

Headings

Headings feature enables support for headings. These are used by the creators to structure their documents. They also aid both the readers, making the content more organized and easier to read, and the search indexers scanning for crucial information. The feature toolbar dropdown by default includes the paragraph format, too.

Choose the sentence, phrase or word you want to turn into a heading, and then use the appropriate item from the headings drop down in the editor toolbar. Easily turn a heading back into paragraph text the same way, too.

Text alignment

Text alignment options let the user employ HTML-derived rich-text features like aligning text to the left, to the right, centering it or justifying - to suit your needs better.

Select a paragraph and use the toolbar dropdown to align the content as needed. The alignment can be reset with the remove format feature.

Blockquote

Blockquote is most often used to emphasize or visually separate important passages or sentences.

Choose a paragraph you want to separate from the main text body and apply the block quote formatting with toolbar button easily.

Indent and outdent

Indent and outdent feature serves similar purpose and allows indenting or outdenting specific parts of the content to create graphic division in between passages or paragraphs.

Choose a paragraph you need to indent and indent it with toolbar button easily.

Code blocks

Code blocks allow you to distinguish regular text from code or script snippets - these are presented in a distinctive visual way depending on the predefined, selectable languages and scripts!

Paste the code, select it and apply proper formatting with a toolbar dropdown selector.

Horizontal line

A horizontal line is often used as a divider between main part of the content. It can be a graphic indicator of a theme shift, too. Use the toolbar button to insert a horizontal rule into the text body.

Rich content

The online HTML editor supports the best of the rich-text editing options to create advanced documents.

Links

Link feature provides support for regular links, emails and anchors.

Select a text you want to turn into link, click the toolbar button and paste the URL. Or simply paste the URL directly into the content and it will automatically turn live, thanks to the autolink feature.

Images

Image feature contains multiple plugins that enable upload, allow captioning, support image styles as well as aligning, resizing and linking images.

Use the toolbar button to upload an image, or simply paste it into the content. Caption the image if needed using the predefined caption footer. Use the image toolbar to control the alignment and image alternative text.

Rich media

Media embed features brings support for inserting embeddable media such as YouTube or Vimeo videos and tweets into your rich text content.

Use the media embed toolbar button and paste the URL of the content you need to embed.

Tables

Tables feature offers table creation and editing tools that help content authors bring tabular data into their documents. It allows for styling the tables and individual cells, selecting, pasting and nesting tables.

Use the toolbar button to insert a table. Use the pop-up table toolbar to manage cells, add or remove rows and columns, format the borders and cell backgrounds. Split, join and move the cells around.

Lists

Lists feature allows to produce better and more efficient message by creating both ordered and unordered lists to help the user organize the content better and in a more readable, attractive manner.

Choose the desired type of list - bulleted or numbered - from the toolbar and apply it with a single button click. You can nest different types of lists, too!

Checkable to-do lists are available, too!

Single click to create step-by-step guides, shopping list, notes, recipes or requirements lists in your content.

Special characters

Special characters plugin provides a possibility to insert predefined special characters into the rich-text editor. It can also be configured to support inserting emojis.

Choose a desired character from a toolbar dropdown chart to insert it into the content.

Pasting

Using existing rich-text content is very simple with the CKEditor 5 WYSIWYG editor. It can be efficiently pasted from Word or Google Docs, keeping the formatting and retaining styles. There is additional support for pasting plain text that will let the pasted content inherit the style of the editor content.

Productivity features

Markdown input

Autoformatting feature allows you to employ Markdown-like syntax as you type to apply basic formatting features on the go. Speed up and simplify the process by skipping the need to use toolbar buttons and dropdowns for the most common formatting features with these easy to memorize options listed below.

Use these GitHub Flavored Markdown inline codes as you type for a faster and more efficient editing workflow:

• Bold – Type **text** or __text__,
• Italic – Type *text* or _text_,
• Code – Type `text`,
• Strikethrough – Type ~~text~~.

The following block formatting options are also available:

• Headings – Start a line with # or ## or ### followed by a space to create a heading 1, heading 2 or heading 3 (up to heading 6 if {@link module:heading/heading~​HeadingConfig#options} defines more headings).
• Bulleted list – Start a line with * or - followed by a space.
• Numbered list – Start a line with 1. or 1) followed by a space.
• To-do list – Start a line with [ ] followed by a space.
• Block quote – Start a line with > followed by a space.
• Code block – Start a line with ```.
• Horizontal line – Start a line with ---.

Spellcheck and proofreading

The spellcheck feature – WProofreader is an innovative, multi-language proofreading tool that combines the functionality of “spell check as you type” and “spell check in a dialog” in a modern, distraction-free UI – just hover over an underlined error to see suggestions and correct it (or reject!) with a single click. Or use a convenient dialog, both with additional in-place replacement suggestions. You can fine-tune the spell checking rules via the dedicated settings menu. You can choose from a set of predefined languages (more may be added as language packs) and manage additional dictionaries. Words can be added to the user dictionary directly from the suggestion card, too.

Automatic text transformations / autocorrection

Automatic text transformations – The feature brings support for implementing autocorrection options, i.e. automatically turning predefined snippets into their improved forms. This feature comes pre-configured with a set of the most popular transformations.

Simply type things like 1/2, 3/4, © or ™ and the feature will transform the text on the go into proper characters.

Real-time collaborative editing features

The CKEditor 5 Framework is a powerful tool aimed at collaborative effort thanks to the real-time collaboration features.

Track changes

Changes tracking. Changes done by the users are marked in the content and shown as suggestions in the sidebar. Suggestions can be accepted or discarded by the users. The suggestion balloon is then closed and the change is no longer marked.

Enable changes tracking with a toolbar dropdown. Use these options to mass-accept or reject introduced changes, or utilize the sidebar to deal with individual changes during a real-time collaborative editing experience.

Comments

Comments. This feature makes it possible to add comments to any part of rich text content in CKEditor 5 in the collaborative edition mode, including text and block elements such as embedded media or images.

Enable comments with a toolbar button. Commented content is marked as highlighted and a corresponding comment balloon is displayed in the sidebar or inline. Comments can be added, edited, deleted and replied to, allowing the editors to collaborate on the same document directly in the rich text editor.

Export to file

The content created with online real-time collaboration editor can be conveniently saved.

Export to PDF

Export to PDF feature allows you to generate a PDF file directly from the CKEditor 5 WYSIWYG editor content. The CKEditor Cloud Services HTML to PDF converter generates a PDF document that can be downloaded by the user. This allows you to easily print your content to the PDF format. Simply click the toolbar button and save the generated PDF file to disk.

Export to Word

Export to Word feature allows you to generate an editable ‘.docx’ file directly from the rich-text content and save it to disk for later editing thanks to the CKEditor Cloud Services. Click the toolbar button to save the editable Word document to disk.

Source access

The CKEditor 5 based “Real-time collaboration editor” allows you to see and edit the HTML code with ease. With a single click you can switch between the WYSIWYG and HTML source editing modes. It allows for full control of the output produced by the online editor and lets the user easily edit and then move the code where it is needed without the necessity to employ 3rd-party dedicated editors.

All you need to produce proper HTML is our online rich-text editor!

Accessibility Support

Please check thi keyboard shortcuts cheatsheet for CKEditor 5 real-time collaboration editor for a starter. Use the popular and widespread keyboard shortcuts for more accessibility and productivity boost.

Content editing

User interface and navigation

Use the following keystrokes for more efficient navigation in the CKEditor 5 user interface:

About real-time collaboration editor

Real-time collaboration editor is powered by CKEditor 5. CKEditor is an open-source WYSIWYG editor that delivers HTML rich content. It comes packed with a plethora of functions and features, from the basic ones like text formatting to the most advanced, industry-standard options like Markdown-formatted output or the commercial export to PDF.

It is an open-source WYSIWYG editor that delivers HTML rich content. It comes packed with a plethora of functions and features, from the basic ones like text formatting to the most advanced, industry-standard options like Markdown-formatted output or the commercial export to PDF.