Skip to main content
React Email provides a collection of high-quality, unstyled components for building responsive emails that work across all major email clients.

Layout Components

Build the structure of your email with these foundational components.

Html

Root HTML component to wrap your email

Head

Contains head components like style and meta elements

Body

Body wrapper for email content

Container

Centers email content with max-width

Section

Section that can be formatted with rows and columns

Row

Row component for layout

Column

Column component for vertical layout

Content Components

Add rich content to your emails with these components.

Text

Block of text separated by blank spaces

Heading

Heading component with h1-h6 support

Button

Link styled to look like a button

Link

Hyperlink component

Img

Display images in your email

Hr

Horizontal rule divider

Code Components

Display code snippets with syntax highlighting.

CodeBlock

Display code blocks with syntax highlighting using Prism.js

CodeInline

Inline code element that works on all email clients

Utility Components

Enhance your emails with fonts, markdown, and preview text.

Preview

Preview text displayed in email inbox

Font

Set custom font family for your email

Markdown

Convert Markdown to valid React Email code

Email Client Support

All React Email components are tested and verified to work across the most popular email clients:
  • Gmail
  • Apple Mail
  • Outlook
  • Yahoo! Mail
  • HEY
  • Superhuman

Installation

You can install individual components as needed:
npm install @react-email/[component-name] -E
Or install all components at once:
npm install @react-email/components -E

Build docs developers (and LLMs) love