
Default
Toolbar
Default
The default variant appears as a tooltip when existing text is highlighted.

Text Color
When changing text color, a color picker appears as a popover.

Lists
Our Rich Text Editor offers numbered and bulleted lists. These lists come with one level of sub-bullets.

Mentions
Users can mention another user by using the @
symbol and picking from the displayed list.

1. When to use
Use a rich text editor to allow users to express themselves with more detail when communicating with other users. Do not use a rich text editor for simple inputs such as "name" or "address". ²

2. Simple UI
When implementing a rich text editor, ensure that the surrounding UI is simple as to not over complicate the page. ¹

3. Default vs Toolbar
Use the default variant when users are editing text in smaller, more restricted, spaces such as a comment popover. Use the toolbar variant when users are editing text in more spacious areas such as a message center.

Related Components
Additional Reading
LinksThe Anatomy Of A Great Rich Text Editor https://froala.com/blog/editor/the-anatomy-of-a-great-rich-text-editor/
Rich Text Editors: App User Experience | Flexum https://flexum.io/post/rich-text-editors-enhancing-user-experience-in-apps