Try Our Live Demo

Customize the React Rich Text Editor with multirow, popup, floating, inline, and context-aware toolbars. Provide quick access to relevant formatting actions, custom tools, and editing controls for images, tables, links, media, and text content.

React Rich Text Editor toolbar layout modes

Render the editor toolbar in Expand, MultiRow, Scrollable, or Popup modes through declarative configuration. Toolbar layouts help organize editing controls based on available toolbar space and layout requirements.

React Rich Text Editor toolbar positioning options

Position editing controls at the top or bottom of the editor. Toolbar layout settings are suitable when control placement needs to align with the application’s page structure or navigation.

React Rich Text Editor floating toolbar

Configure a floating toolbar with an adjustable offset and enable or disable its floating behavior during editing. Floating toolbar settings are suitable when formatting actions need to remain available while working with long-form or rich content.

React Rich Text Editor inline formatting

Display an inline formatting toolbar when text is selected to provide access to commonly used formatting options. The inline toolbar supports text styling without moving away from the selected content.

React Rich Text Editor context-aware quick toolbar

Context-aware quick toolbars appear when users click images, links, tables, audio, or video elements and provide content-specific actions. Inline access to relevant actions is suitable when editing documents that combine multiple content types.

React Rich Text Editor custom tools and templates

Custom tools and templates

Add custom toolbar items with configurable icons and actions alongside built-in editing controls. Additional commands are useful when editors need actions such as snippet insertion, approval steps, or brand asset shortcuts.

See Why Developers Love Syncfusion

Our Customers Love Us

Having an excellent set of tools and a great support team, Syncfusion reduces customers’ development time. Here are some of their experiences.

John A.

C# Developer (Contract)

Nice suite of components

A very complete set of components, that has an edge on other major vendors which offer components. A lot less code required to use and code samples for more complete components. Integrates well with other 3rd party components.

Dejan D.

Chief Executive Officer

Perfect for any developer

The Syncfusion Essential Studio has excellent features that are updated or added constantly on a regular basis. The support is exceptional—fast and professional responses. The support team provides you with code samples. As for the bugs, they always try to include the fix in the next release.

Frequently Asked Questions

How many toolbar layout options are available in the Syncfusion React Rich Text Editor?

The React Rich Text Editor offers four toolbar layouts: Expand, MultiRow, Scrollable, and Popup. Different toolbar layouts support a range of editing experiences while maintaining accessibility and usability.

Does the Syncfusion React Rich Text Editor support floating toolbars?

Yes. The React Rich Text Editor floating toolbar keeps formatting tools visible while scrolling through long documents. Offset, toggle behavior, and dismiss controls can be configured through toolbar settings.

Can an inline toolbar be displayed in the Syncfusion React Rich Text Editor?

Yes. The React Rich Text Editor inline toolbar appears when text is selected and surfaces formatting actions directly within the content area. Focused editing workflows are supported alongside keyboard navigation.

Does the Syncfusion React Rich Text Editor allow the toolbar to be repositioned?

Yes. The React Rich Text Editor toolbar can be positioned at the top or bottom of the editor through toolbar configuration. Top placement supports desktop authoring surfaces, while bottom placement supports mobile-first editing experiences.

Are there content-specific quick toolbars available in the Syncfusion React Rich Text Editor?

Yes. The React Rich Text Editor provides quick toolbars for images, tables, links, and media. Content-specific actions appear automatically when the corresponding element is selected, reducing the need to use the main toolbar.

Can custom items be added to the Syncfusion React Rich Text Editor toolbar?

Yes. The React Rich Text Editor toolbar supports custom tools, templates, and quick actions across all layout modes. Custom items can be added alongside built-in controls to create a tailored editing experience.

Resources