Skip to main content
React Email

Welcome to React Email

React Email is a collection of high-quality, unstyled components for creating beautiful emails using React and TypeScript. It reduces the pain of coding responsive emails with dark mode support and handles inconsistencies between Gmail, Outlook, and other email clients for you.

Installation

Install React Email components and get started in seconds

Quickstart

Build your first email template in minutes

Components

Explore all available React Email components

Integrations

Send emails with Resend, Nodemailer, SendGrid, and more

Why React Email?

Email development needs a revamp. We need to stop developing emails like it’s 2010 and rethink how email can be done in 2025 and beyond.

Modern DX

Write emails using React components and TypeScript

Email Client Support

Tested on Gmail, Outlook, Apple Mail, Yahoo, and more

Dark Mode

Built-in support for dark mode across email clients

Responsive

Mobile-friendly emails without the headache

Type Safe

Full TypeScript support for better DX

Developer Tools

Live preview server and CLI tools included

What’s Included

Over 20 production-ready components including Button, Container, Text, Image, and more. All components are unstyled by default, giving you complete control over the design.
Transform your React components into HTML email templates with the @react-email/render package. Works in Node.js, Edge runtimes, and browsers.
Live preview server with hot reload. See your email changes instantly as you code with the react-email CLI.
Examples and guides for sending emails with popular providers like Resend, Nodemailer, SendGrid, Postmark, AWS SES, and more.
React Email components are designed to work across all major email clients, ensuring your emails look great everywhere.

Supported Email Clients

All components are tested using the most popular email clients:
  • Gmail ✓
  • Apple Mail ✓
  • Outlook ✓
  • Yahoo! Mail ✓
  • HEY ✓
  • Superhuman ✓

Next Steps

1

Install React Email

Get started by installing the components package
npm install @react-email/components
2

Create Your First Email

Build a simple email template using React components
import { Button, Html } from '@react-email/components';

export default function Email() {
  return (
    <Html>
      <Button href="https://example.com">Click me</Button>
    </Html>
  );
}
3

Render and Send

Convert your React component to HTML and send it with your email provider
import { render } from '@react-email/components';

const html = await render(<Email />);

Ready to start?

Head over to the installation guide to get React Email set up in your project

Build docs developers (and LLMs) love