Anatomy
Bold
Italic
Underline
Numbered list
Bulleted list
Text color
Link
States
Best Practices
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". ²
Do
Don't
Simple UI
When implementing a rich text editor, ensure that the surrounding UI is simple as to not over complicate the page. ¹
Do
Don't
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.
Do
Don't
More
Related Pages
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