All three renderers use the same EmailTheme token shape. React Email and JSX Email convert those tokens into their framework-specific Tailwind configuration, while MJML React applies them directly.
Install a theme
Themes are registry items named theme-<id> under each framework:
$ pnpm dlx shadcn@latest add @emailcn/react-email/theme-default
Or paste the full item URL:
$ pnpm dlx shadcn@latest add https://emailcn.run/r/react-email/theme-linear.json
Use with React Email
import { Tailwind } from "react-email";
import { createEmailTailwindConfig } from "@/components/email/email-theme";
import { defaultTheme } from "@/components/email/theme-default";<Tailwind config={createEmailTailwindConfig(defaultTheme)}>
{/* ... */}
</Tailwind>Use with JSX Email
import { EmailTailwind } from "@/components/email/email-theme";
import { defaultTheme } from "@/components/email/theme-default";<EmailTailwind theme={defaultTheme}>{/* ... */}</EmailTailwind>Use with MJML React
MJML React components use the tokens directly:
import { defaultTheme } from "@/components/email/theme-default";<MjmlText color={defaultTheme.colorText}>Hello</MjmlText>