apps/docs/components/markdown.mdx
import Support from '/snippets/support.mdx'
Install component from your command line.
<CodeGroup>npm install @react-email/components -E
# or get the individual package
npm install @react-email/markdown -E
yarn add @react-email/components -E
# or get the individual package
yarn add @react-email/markdown -E
pnpm add @react-email/components -E
# or get the individual package
pnpm add @react-email/markdown -E
Add the component to your email template. Include styles where needed.
import { Markdown, Html } from "@react-email/components";
const Email = () => {
return (
<Html lang="en" dir="ltr">
<Markdown
markdownCustomStyles={{
h1: { color: "red" },
h2: { color: "blue" },
codeInline: { background: "grey" },
}}
markdownContainerStyles={{
padding: "12px",
border: "solid 1px black",
}}
>{`# Hello, World!`}</Markdown>
<Markdown children={`# This is a ~~strikethrough~~`} />
</Html>
);
};