Body

Install

Install component from your command line.

npm install react-email -E

yarn add react-email -E

pnpm add react-email -E

Getting started

Add the component to your email template. Include styles where needed.

import { Html, Body, Button } from "react-email";

const Email = () => {
  return (
    <Html lang="en" dir="ltr">
      <Body lang="en" dir="ltr" style={{ backgroundColor: "#ffffff" }}>
        <Button href="https://example.com" style={{ color: "#61dafb" }}>
          Click me
        </Button>
      </Body>
    </Html>
  );
};

Props

lang

string

default:"en"

Identify the language of text content on the email.

dir

string

default:"ltr"

Identify the direction of text content on the email.

When customizing lang and/or dir, you should set the same values on the Html component. Some email clients strip the html or body tags, so it’s necessary to have both.

Support

All components were tested using the most popular email clients.

Gmail

Apple Mail

Outlook

Yahoo! Mail

HEY

Superhuman

Head

Button

Overview

Getting Started

Guides

Components

Utilities

Integrations

Contributing

Install

Getting started

Props

Support

​Install

​Getting started

​Props

​Support

Install

Getting started

Props

Support