Skip to content

React Email

A set of React components for building email layouts that render across common email clients.

Stars
19.9k
Forks
1.1k
Licence
MIT
Language
TypeScript
Last update
7 days ago
Type
Library

What it is

React Email is a collection of unstyled components you use to write emails in React and TypeScript. It handles layout details such as responsive design and dark mode support, and aims to smooth out differences between clients like Gmail and Outlook. Once an email is built, it can be converted to HTML and sent through any email service provider.

  • Build a responsive welcome or receipt email as a React component using the provided Button, Container, and Heading components
  • Render a finished email to HTML and plain text for sending through a provider integration such as Nodemailer or AWS SES
  • Use Tailwind-based styling through the Tailwind component when writing email templates

Great for

  • Developers who already build web apps with React and want to write email templates the same way
  • Teams that want email templates to render consistently across major email clients
  • Projects that send transactional or marketing email through an existing provider such as Resend, SendGrid, or Postmark

Not ideal for

  • People who only need to send a single plain-text email and do not need templates; the project is aimed at template building with React
  • Non-developers who want a drag-and-drop email builder; the README describes an Editor, but the core workflow is code-first
Step-by-step guide: how to use React EmailInstall, first run, examples, tips and FAQs

How to get it

  1. 1

    Install with a package manager

    You'll need: Node.js

    Install the package

    npm i react-email@latest
  2. 2

    Run it

    • Install the package with npm i react-email@latest
    • Define an email template as a React component that imports components such as Button from react-email
    • Render the template to HTML and pass it to an email service provider integration from the examples folder
  3. 3

    Get the most out of it

    • Use the Editor (built on TipTap and ProseMirror) if you want to produce email-ready HTML and plain text from a visual interface
    • Install the React Email skill with npx skills add resend/react-email so a coding agent can help build emails
    • Read the LLM-friendly docs at react.email/docs/llms.txt when working with an AI assistant
    • Browse the examples folder to find a ready-made integration for your email provider

Downloads

Strengths

  • Components are unstyled and built for email clients, so you do not need to write table-based layouts by hand
  • The README lists tested support for popular clients including Gmail, Apple Mail, Outlook, and Yahoo! Mail
  • Includes examples for many email service providers and an MIT license

Trade-offs

  • The README does not detail the setup beyond npm installation, so first-time users may need the documentation site
  • The Editor and AI-agent skill are extra features whose depth the README does not fully explain

How it compares

ProjectStarsTypeLevelUpdatedBest for
react-email (this)19.9kLibrarybeginner7 days agoDevelopers who already build web apps with React and want to write email templates the same way
mjml18.3kDev toolbeginner14 days agoDevelopers who build transactional or marketing emails by hand
EmailValidator11.6kLibrarybeginner4 days agoPHP developers adding email checks to sign-up or contact forms
frappe11kLibraryadvanced4 days agoDevelopers building business or internal data-heavy applications
check-if-email-exists10.4kLibraryintermediate7 days agoDevelopers adding email validation to a sign-up form or data pipeline

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.