@react-email/markdown

!React Email Markdown cover

Install

Install component from your command line.

#### With yarn

``sh
yarn add @react-email/markdown -E
`

#### With npm

`sh
npm install @react-email/markdown -E
`

Getting started

Add the component around your email body content.

`jsx
import { Markdown } from "@react-email/markdown";
import { Html } from "@react-email/html";

const Email = () => {
return (

markdownCustomStyles={{
h1: { color: "red" },
h2: { color: "blue" },
codeInline: { background: "grey" },
}}
markdownContainerStyles={{
padding: "12px",
border: "solid 1px black",
}}
>{# Hello, World!}

{/ OR /}

# This is a ~~strikethrough~~} />

);
`

Props

$3

- Type: string

Contains the markdown content that will be rendered in the email template.

$3

- Type: object
- Default: {}

Provide custom styles for the corresponding HTML element (e.g., p, h1, h2, etc.).

$3

- Type: object
- Default: {}

Provide custom styles for the containing div` that wraps the markdown content.

Support

This component was tested using the most popular email clients.

| | | | | | |
| -------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ |
| Gmail ✔ | Apple Mail ✔ | Outlook ✔ | Yahoo! Mail ✔ | HEY ✔ | Superhuman ✔ |

License

MIT License