Render - React Email

Transform React components into HTML email templates.

1. Install dependencies

Install package from your command line.

2. Create an email using React

Start by building your email template in a .jsx or .tsx file.

3. Convert to HTML

Import an existing React component and convert into a HTML string.

This will generate the following output:

4. Convert to Plain Text

Plain text versions of emails are important because they ensure that the message can be read by the recipient even if they are unable to view the HTML version of the email. This is important because not all email clients and devices can display HTML email, and some recipients may have chosen to disable HTML email for security or accessibility reasons. Here’s how to convert a React component into plain text.

This will generate the following output:

Exclude content from plain-text output

Add data-skip-in-text="true" to an element to exclude the element and its contents when using toPlainText(). This does not exclude the element from the HTML output.

The plain-text output will be:

Options