Rich Text Editor

This is a rich text editor I created. It is built on the Draft.js framework for React. The Github repo for this demo is here. You can see other examples of my work at

Notable features include:

  • support for tables
  • insert and resize images
  • insert and edit links

bullet list
numbered list
decrease indent
increase indent
Enter your content here

Output Preview - (non-contenteditable HTML generated by exporting the editor's internal content state)

This is some sample content for the rich text editor. It demonstrates paragraphs, custom block-level styling, the use of tables, and it has an image floated to the left of the next paragraph. Feel free to modify this content or delete it all and create you own.

You can click on this link or this link in the editor to see what they point to and edit them.

If you click on the image you can resize it. If you have the image selected, you can toggle float-left with cmd+L. To ensure you have the image selected rather than an adjacent paragraph, first click on the image to activate it - you'll see the dotted resize border appear - then click in the empty space between the dotted border and the image and the image will become selected.

You can give a paragraph some custom styling like this while in code view and it
will be preserved in editor view and in the html outpout.

 ABC Company
123 Circle Rd.
Springfield, UT 84201
Phone: 801-233-3332
XYZ Partners Ltd.
789 Circuit Ave.
Anytown, UT 84111
Phone: 385-335-5555

Sample TableĀ Column AColumn BColumn C
Criteria for passing503744