Blazor Rich Text Editor - Markdown Editor Component

Inline mode

Make the editor show up when you click or select the content in an editable area.

• Inline HTML editor example

Mention and hashtag

When composing content, users or groups can be tagged or selected from a suggestion list.

• Mention and hashtag example

Formatting text

• Format the selected content, whole paragraphs, or specific words or characters.
• Format headings, quotations, code, paragraphs, etc.
• Bold, italicize, underline, strikethrough, or capitalize letters and words.
• Change paragraph indentation and spacing.
• Select fonts and sizes.
• Use subscripts and superscripts.
• Select font color and the background color for the content.

Auto formatting for Markdown syntax

Autoformat enables quick content formatting using Markdown-like shortcodes. This eliminates the need for toolbar buttons or dropdowns for common formatting. As Markdown syntax such as # for headings, ** for bold, and * for italics are typed, the editor automatically converts it into HTML elements.

Checklists

Checklists (to-do lists) can be created directly within the Rich Text Editor. Users can easily add interactive checkbox items to their content, enabling task tracking and management within documents.

Adding custom lists

Create ordered (numbered) or unordered (bulleted) lists to organize content. Customize bullet styles for unordered lists with options like circles or squares, and use various numbering formats such as lowercase Greek or uppercase Roman for ordered lists.

Quick insert for table rows and columns

Users can insert rows and columns into a table quickly. When hovering the mouse near the table edges, a “+” icon appears, enabling users to add rows or columns with a single click.

Line height

Users can adjust vertical spacing between lines of text, giving them control over how tightly or loosely the text is packed within paragraphs. This helps improve readability and visual balance in the content layout.

Full screen text editor

This built-in option makes the WYSIWYG HTML editor full screen (a full-page editor) for editing the content.

Paste from Microsoft Word and Excel

Provides built-in options to paste content with images from Microsoft Word, Outlook, and Excel while automatically filtering unwanted tags, attributes, and styles. You can choose to paste content as plain text, with cleaned formatting, or retain the original source formatting.

Auto hyperlink to URL

The control turns text into a hyperlink automatically when a user types a URL as plain text.

Form validations

The Rich Text Editor seamlessly supports forms and obtains values on form submission. The two types of validation are:

• Required validation
• Maximum length validation

• Form validation documentation

Limit content length

Users can restrict the number of characters in a particular section.

Resizable editor

The Blazor Rich Text Editor can be resized, allowing users to widen or shrink the content area.

• Resizable editor documentation

Format painter

Use the format painter to copy formatting and apply it to your content, eliminating the need for tedious reformatting. Access the format painter through the toolbar or keyboard shortcuts for quick and easy application. Take advantage of the sticky mode by double-clicking the toolbar button, which allows you to apply formats to multiple locations.