ASP.NET Core Rich Text Editor - A WYSIWYG Markdown Editor

Inline mode

The ASP.NET Core Rich Text Editor displays an inline HTML editor when content within an editable area is clicked or selected.

• Inline HTML editor example
• Inline mode documentation

Mention and hashtag

While composing content in the ASP.NET Core Rich Text Editor, users or groups can be tagged or selected from a suggestion list.

Insert emoji

Users can add emojis to their content from an extensive collection. The emoji picker can be accessed by typing the colon (:) key in the ASP.NET Core Rich Text Editor.

• Insert emoji documentation

Formatting text

• Apply formatting to selected content, entire paragraphs, or specific words and characters.
• Style headings, quotations, code blocks, paragraphs, and more.
• Use bold, italics, underline, strikethrough, or adjust letter casing.
• Modify paragraph indentation and spacing.
• Select fonts and define font sizes.
• Apply subscript and superscript formatting.
• Choose font color and background color for the content.

Auto-formatting for Markdown syntax

Autoformatting enables quick content styling using Markdown-like shortcuts, eliminating the need for toolbar buttons or dropdowns for common formatting. When users type syntax such as # for headings, ** for bold, or * for italics, the editor automatically converts it into corresponding HTML elements.

Checklists

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

Adding lists

Create ordered (numbered) or unordered (bulleted) lists to organize content effectively.

Custom lists

Customize the appearance of unordered list bullets with styles like circles or squares. Use different numbering formats for ordered lists, such as lowercase Greek letters or uppercase Roman numerals.

Quick insert for table rows and columns

Users can quickly add rows and columns to tables. When hovering near table edges, a “+” icon appears, allowing insertion with a single click.

Line height

Users can modify the vertical spacing between lines of text, controlling how compact or spacious the content appears, which improves readability and visual balance.

Full-screen text editor

Enable full-screen mode to expand the HTML editor into a full-page view for focused content editing.

Paste from Microsoft Word and Excel

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

• Paste from Microsoft Word documentation

Format painter

The format painter allows users to copy formatting and apply it to content easily, reducing manual reformatting. It can be accessed via the toolbar or keyboard shortcuts. The sticky mode, activated by double-clicking the toolbar button, enables formatting to be applied across multiple sections.

Auto-hyperlink URLs

The ASP.NET Core Rich Text Editor automatically converts plain text URLs into clickable hyperlinks when they are typed.

ASP.NET Core form validation

The Rich Text Editor integrates seamlessly with forms and captures values during form submission. It supports the following validation types:

• Required validation
• Maximum length validation

Limit content length

Users can define a character limit for specific sections, enabling control over the amount of content entered.

• Maximum character count limit documentation

Resizable editor

The ASP.NET Core Rich Text Editor is resizable, allowing users to expand or reduce the content area as needed.

• Resizable editor example

Insert an image through the file manager

The built-in file manager allows users to upload and insert images directly from cloud storage or a server.