Features’ HTML output overview

Listed below are all official CKEditor 5 packages as well as some partner packages together with their possible HTML output. If a plugin generates a different HTML output depending on its configuration, it is described in the “HTML output” column.

The classes, styles or attributes applied to an HTML element are all possible results. It does not mean they all will always be used.

If a given plugin does not generate any output, the “HTML output” is described as “None”. Wildcard character * means any value is possible.

The data used to generate the following tables comes from the package metadata. You can read more about it in the package metadata guide.

ckeditor5-adapter-ckfinder

Source file: @ckeditor/ckeditor5-adapter-ckfinder/ckeditor5-metadata.json

Plugin	HTML output
CKFinder Upload Adapter Feature guide API documentation	None.

ckeditor5-alignment

Source file: @ckeditor/ckeditor5-alignment/ckeditor5-metadata.json

Plugin	HTML output
Alignment Feature guide API documentation	<$block style="text-align:*"> By default, the alignment feature uses the text-align inline style.
	<$block class="*"> If config.alignment.options is set, these classes are used for alignment instead of inline styles.

ckeditor5-autoformat

Source file: @ckeditor/ckeditor5-autoformat/ckeditor5-metadata.json

Plugin	HTML output
Autoformat Feature guide API documentation	None.

ckeditor5-autosave

Source file: @ckeditor/ckeditor5-autosave/ckeditor5-metadata.json

Plugin	HTML output
Autosave Feature guide API documentation	None.

ckeditor5-basic-styles

Source file: @ckeditor/ckeditor5-basic-styles/ckeditor5-metadata.json

Plugin	HTML output
Bold Feature guide API documentation	<strong>
Code Feature guide API documentation	<code>
Italic Feature guide API documentation	<i>
Strikethrough Feature guide API documentation	<s>
Subscript Feature guide API documentation	<sub>
Superscript Feature guide API documentation	<sup>
Underline Feature guide API documentation	<u>

ckeditor5-block-quote

Source file: @ckeditor/ckeditor5-block-quote/ckeditor5-metadata.json

Plugin	HTML output
Block quote Feature guide API documentation	<blockquote>

ckeditor5-ckfinder

Source file: @ckeditor/ckeditor5-ckfinder/ckeditor5-metadata.json

Plugin	HTML output
CKFinder Feature guide API documentation	None.

ckeditor5-cloud-services

Source file: @ckeditor/ckeditor5-cloud-services/ckeditor5-metadata.json

Plugin	HTML output
Cloud Services Feature guide API documentation	None.

ckeditor5-code-block

Source file: @ckeditor/ckeditor5-code-block/ckeditor5-metadata.json

Plugin	HTML output
Code blocks Feature guide API documentation	<pre>
	<code class="language-*"> By default, the language of the code block is represented as a CSS class prefixed by language-
	<code class="*"> The CSS class name can be customized via the config.codeBlock.languages array.

ckeditor5-comments

Source file: @ckeditor/ckeditor5-comments/ckeditor5-metadata.json

Plugin	HTML output
Comments Feature guide API documentation	<comment id="*" type="*" >
	<comment-end name="*"><comment-start name="*">
	<* data-comment-end-after="*" data-comment-start-before="*" > The plugin adds the data-comment-end-after and data-comment-start-before attributes to other elements on which the comment starts or ends.

ckeditor5-easy-image

Source file: @ckeditor/ckeditor5-easy-image/ckeditor5-metadata.json

Plugin	HTML output
Easy Image Feature guide API documentation	None.

ckeditor5-essentials

Source file: @ckeditor/ckeditor5-essentials/ckeditor5-metadata.json

Plugin	HTML output
Essentials API documentation	<br>

ckeditor5-export-pdf

Source file: @ckeditor/ckeditor5-export-pdf/ckeditor5-metadata.json

Plugin	HTML output
Export to PDF Feature guide API documentation	None.

ckeditor5-export-word

Source file: @ckeditor/ckeditor5-export-word/ckeditor5-metadata.json

Plugin	HTML output
Export to Word Feature guide API documentation	None.

ckeditor5-find-and-replace

Source file: @ckeditor/ckeditor5-find-and-replace/ckeditor5-metadata.json

Plugin	HTML output
Find and replace Feature guide API documentation	None.

ckeditor5-font

Source file: @ckeditor/ckeditor5-font/ckeditor5-metadata.json

Plugin	HTML output
Font background color Feature guide API documentation	<span style="background-color:*">
Font color Feature guide API documentation	<span style="color:*">
Font size Feature guide API documentation	<span class="text-tiny text-small text-big text-huge"> If the config.fontSize.options option is not set or it contains predefined named presets, the feature uses class names.
	<span style="font-size:*"> If the config.fontSize.options option contains numerical values, the font size feature uses the font-size inline style.
	<* class="*" style="*:*" > The plugin can be configured to return any element with any classes and any inline styles.
Font family Feature guide API documentation	<span style="font-family:*"> By default, the font family feature uses the font-family inline style.
	<* class="*" style="*:*" > The plugin can be configured to return any element with any classes and any inline styles.

ckeditor5-heading

Source file: @ckeditor/ckeditor5-heading/ckeditor5-metadata.json

Plugin	HTML output
Title Feature guide API documentation	<h1>
Heading Feature guide API documentation	<h2><h3><h4> HTML element may contain classes, styles or attributes, that are created by other plugins, which alter the <$block> element. The HTML element may contain classes, styles or attributes that are created by other plugins, which alter the <code>$block element.
	<*> The plugin can be configured to return any element name as a heading.

ckeditor5-highlight

Source file: @ckeditor/ckeditor5-highlight/ckeditor5-metadata.json

Plugin	HTML output
Highlight Feature guide API documentation	<mark class="marker-yellow marker-green marker-pink marker-blue pen-red pen-green"> By default, this plugin has 4 markers and 2 pens preconfigured.
	<mark class="*"> The plugin can be configured to set any classes on the <mark> element.

ckeditor5-horizontal-line

Source file: @ckeditor/ckeditor5-horizontal-line/ckeditor5-metadata.json

Plugin	HTML output
Horizontal line Feature guide API documentation	<hr>

ckeditor5-html-embed

Source file: @ckeditor/ckeditor5-html-embed/ckeditor5-metadata.json

Plugin	HTML output
HTML embed Feature guide API documentation	<div class="raw-html-embed">
	<* class="*" style="*:*" > The plugin can output any arbitrary HTML provided by the user. That HTML is always wrapped with a <div class="raw-html-embed"> element.

ckeditor5-html-support

Source file: @ckeditor/ckeditor5-html-support/ckeditor5-metadata.json

Plugin	HTML output
General HTML Support Feature guide API documentation	<* class="*" style="*:*" *="*" > The plugin can output any arbitrary HTML configured by config.htmlSupport option.
Data Filter API documentation	<* class="*" style="*:*" *="*" > The plugin can output any arbitrary HTML depending on its configuration.
Data Schema API documentation	None.
HTML comment Feature guide API documentation	The plugin can output HTML comments that were added from the editor inital data or by the plugin API.

ckeditor5-image

Source file: @ckeditor/ckeditor5-image/ckeditor5-metadata.json

Plugin	HTML output
Auto image Feature guide API documentation	None.
Block image Feature guide API documentation	<figure class="image">
	<img alt="*" sizes="*" src="*" srcset="*" width="*" >
Inline image Feature guide API documentation	<img alt="*" sizes="*" src="*" srcset="*" width="*" >
Image Feature guide API documentation	None.
Image caption Feature guide API documentation	<figcaption>
Image resize Feature guide API documentation	<figure class="image_resized" style="width:*" >
Image style Feature guide API documentation	<figure class="image-style-side image-style-align-left image-style-align-right image-style-block-align-center image-style-block-align-left image-style-block-align-right">
	<figure class="*"> The plugin can be configured to set any class names on the <figure> element.
Image toolbar Feature guide API documentation	None.
Image upload Feature guide API documentation	None.
Image insert Feature guide API documentation	None.

ckeditor5-indent

Source file: @ckeditor/ckeditor5-indent/ckeditor5-metadata.json

Plugin	HTML output
Indent Feature guide API documentation	None.
Indent block Feature guide API documentation	<$block style="margin-left:*; margin-right:*"> By default, the plugin uses inline styles for indentation.
	<$block class="*"> If classes are defined in config.indentBlock.classes, they are used instead of inline styles.

ckeditor5-language

Source file: @ckeditor/ckeditor5-language/ckeditor5-metadata.json

Plugin	HTML output
Text part language Feature guide API documentation	<span dir="*" lang="*" >

ckeditor5-link

Source file: @ckeditor/ckeditor5-link/ckeditor5-metadata.json

Plugin	HTML output
Autolink Feature guide API documentation	None.
Link Feature guide API documentation	<a href="*">
	<a rel="*" target="*" > If config.link.addTargetToExternalLinks is enabled, then the external links are decorated with rel and target attributes.
	<a class="*" style="*:*" *="*" > The plugin can be configured to set any classes, styles or attributes on the <a> tag via custom config.link.decorators configuration.
Link image Feature guide API documentation	<a href="*">

ckeditor5-list

Source file: @ckeditor/ckeditor5-list/ckeditor5-metadata.json

Plugin	HTML output
List Feature guide API documentation	<ol><ul>
	<li> HTML element may contain classes, styles or attributes, that are created by other plugins, which alter the <$block> element.
To-do list Feature guide API documentation	<ul class="todo-list">
	<li>
	<label class="todo-list__label">
	<span class="todo-list__label__description">
	<input checked="*" disabled="*" type="*" >
List properties Feature guide API documentation	<ol style="list-style-type:*" start="*" reversed="*" ><ul style="list-style-type:*" start="*" reversed="*" >
Document list API documentation	<ol><ul>
	<li>
Document list properties API documentation	<ol style="list-style-type:*" start="*" reversed="*" type="*" ><ul style="list-style-type:*" start="*" reversed="*" type="*" >

ckeditor5-markdown-gfm

Source file: @ckeditor/ckeditor5-markdown-gfm/ckeditor5-metadata.json

Plugin	HTML output
Markdown Feature guide API documentation	None.

ckeditor5-media-embed

Source file: @ckeditor/ckeditor5-media-embed/ckeditor5-metadata.json

Plugin	HTML output
Media embed Feature guide API documentation	<figure class="media">
	<oembed url="*"> If config.mediaEmbed.previewsInData is turned off, the media preview is not displayed and the media is represented using only the <oembed> tag (by default).
	<div data-oembed-url="*"> If config.mediaEmbed.previewsInData is turned on, the media preview is displayed in the view.
	<* url="*"> If config.mediaEmbed.previewsInData is turned off, the plugin can be configured to return any element name specified by config.mediaEmbed.elementName.
	<div style="height:*; padding-bottom:*; position:*"> If config.mediaEmbed.previewsInData is turned on, the media preview is displayed in the view.
	<iframe style="height:*; left:*; position:*; top:*; width:*" *allow*="*" frameborder="*" src="*" > If config.mediaEmbed.previewsInData is turned on, the media preview is displayed in the view.
	<* class="*" style="*:*" *="*" > The plugin can be configured to return any element with any class, inline style, and attribute, via config.mediaEmbed.providers for previewable media.
Media embed toolbar Feature guide API documentation	None.

ckeditor5-mention

Source file: @ckeditor/ckeditor5-mention/ckeditor5-metadata.json

Plugin	HTML output
Mention Feature guide API documentation	<span class="mention" data-mention="*" >

ckeditor5-minimap

Source file: @ckeditor/ckeditor5-minimap/ckeditor5-metadata.json

Plugin	HTML output
Content minimap Feature guide API documentation	None.

ckeditor5-page-break

Source file: @ckeditor/ckeditor5-page-break/ckeditor5-metadata.json

Plugin	HTML output
Page break Feature guide API documentation	<div class="page-break" style="page-break-after:*" >
	<span style="display:*">

ckeditor5-pagination

Source file: @ckeditor/ckeditor5-pagination/ckeditor5-metadata.json

Plugin	HTML output
Pagination Feature guide API documentation	<* style="page-break-before:*" data-pagination-page="*" > When using editor.getData( { pagination: true } ). Otherwise, no additional elements are generated.

ckeditor5-paragraph

Source file: @ckeditor/ckeditor5-paragraph/ckeditor5-metadata.json

Plugin	HTML output
Paragraph API documentation	<p> HTML element may contain classes, styles or attributes, that are created by other plugins, which alter the <$block> element. The HTML element may contain classes, styles or attributes that are created by other plugins, which alter the <code>$block element.

ckeditor5-paste-from-office

Source file: @ckeditor/ckeditor5-paste-from-office/ckeditor5-metadata.json

Plugin	HTML output
Paste from Office Feature guide API documentation	None.

ckeditor5-real-time-collaboration

Source file: @ckeditor/ckeditor5-real-time-collaboration/ckeditor5-metadata.json

Plugin	HTML output
Presence list Feature guide API documentation	None.
Real-time collaborative comments Feature guide API documentation	None.
Real-time collaborative editing Feature guide API documentation	None.
Real-time collaborative track changes Feature guide API documentation	None.
Real-time collaborative revision history Feature guide API documentation	None.

ckeditor5-remove-format

Source file: @ckeditor/ckeditor5-remove-format/ckeditor5-metadata.json

Plugin	HTML output
Remove format Feature guide API documentation	None.

ckeditor5-restricted-editing

Source file: @ckeditor/ckeditor5-restricted-editing/ckeditor5-metadata.json

Plugin	HTML output
Restricted editing mode Feature guide API documentation	<span class="restricted-editing-exception">
Standard editing mode Feature guide API documentation	<span class="restricted-editing-exception">

ckeditor5-revision-history

Source file: @ckeditor/ckeditor5-revision-history/ckeditor5-metadata.json

Plugin	HTML output
Revision History Feature guide API documentation	None.

ckeditor5-source-editing

Source file: @ckeditor/ckeditor5-source-editing/ckeditor5-metadata.json

Plugin	HTML output
Source editing Feature guide API documentation	None.

ckeditor5-special-characters

Source file: @ckeditor/ckeditor5-special-characters/ckeditor5-metadata.json

Plugin	HTML output
Special characters Feature guide API documentation	None.
Special characters essentials Feature guide API documentation	None.
Special characters arrows Feature guide API documentation	None.
Special characters currency Feature guide API documentation	None.
Special characters latin Feature guide API documentation	None.
Special characters mathematical Feature guide API documentation	None.
Special characters text Feature guide API documentation	None.

ckeditor5-style

Source file: @ckeditor/ckeditor5-style/ckeditor5-metadata.json

Plugin	HTML output
Style API documentation	<* class="*"> The plugin can output any arbitrary HTML depending on its configuration.

ckeditor5-table

Source file: @ckeditor/ckeditor5-table/ckeditor5-metadata.json

Plugin	HTML output
Table Feature guide API documentation	<figure class="table">
	<table><thead><tbody><tr>
	<td colspan="*" rowspan="*" ><th colspan="*" rowspan="*" >
Table cell properties Feature guide API documentation	<td style="background-color:*; border:*; border-*:*; height:*; padding:*; text-align:*; vertical-align:*; width:*"><th style="background-color:*; border:*; border-*:*; height:*; padding:*; text-align:*; vertical-align:*; width:*">
Table properties Feature guide API documentation	<figure style="float:*; height:*; width:*">
	<table style="background-color:*; border:*; border-*:*">
Table toolbar Feature guide API documentation	None.
Table caption Feature guide API documentation	<figcaption data-placeholder="*">
Table column resize Feature guide API documentation	<colgroup>
	<col style="width:*">

ckeditor5-track-changes

Source file: @ckeditor/ckeditor5-track-changes/ckeditor5-metadata.json

Plugin	HTML output
Track changes Feature guide API documentation	None.

ckeditor5-typing

Source file: @ckeditor/ckeditor5-typing/ckeditor5-metadata.json

Plugin	HTML output
Text transformation Feature guide API documentation	None.

ckeditor5-ui

Source file: @ckeditor/ckeditor5-ui/ckeditor5-metadata.json

Plugin	HTML output
Block toolbar Feature guide API documentation	None.

ckeditor5-upload

Source file: @ckeditor/ckeditor5-upload/ckeditor5-metadata.json

Plugin	HTML output
Base64 upload adapter Feature guide API documentation	None.
Simple upload adapter Feature guide API documentation	None.

ckeditor5-watchdog

Source file: @ckeditor/ckeditor5-watchdog/ckeditor5-metadata.json

Plugin	HTML output
Watchdog Feature guide API documentation	None.

ckeditor5-word-count

Source file: @ckeditor/ckeditor5-word-count/ckeditor5-metadata.json

Plugin	HTML output
Word count Feature guide API documentation	None.

mathtype-ckeditor5

Source file: not published yet

Plugin	HTML output
MathType Feature guide	<* *="*"> For a complete list of available MathML element and attribute names, visit MDN Web Docs for MathML.

wproofreader-ckeditor5

Source file: not published yet

Plugin	HTML output
WProofreader Feature guide	None.