Components
Section
Display a section that can also be formatted using rows and columns.
Install
Install component from your command line.
npm install @react-email/section -E
Getting started
Add the component to your email template. Include styles where needed.
import { Section } from '@react-email/section';
import { Column } from '@react-email/column';
import { Row } from '@react-email/row';
import { Text } from '@react-email/text';
const Email = () => {
return (
{/* A simple `section` */}
<Section>
<Text>Hello World</Text>
</Section>
{/* Formatted with `rows` and `columns` */}
<Section>
<Row>
<Column>Column 1, Row 1</Column>
<Column>Column 2, Row 1</Column>
</Row>
<Row>
<Column>Column 1, Row 2</Column>
<Column>Column 2, Row 2</Column>
</Row>
</Section>
);
};
Support
All components were tested using the most popular email clients.
Gmail
Apple Mail
Outlook
Yahoo! Mail
HEY
Superhuman