Stop designing emails from scratch
Describe what you need, get production-ready React Email code. Built for developers who'd rather ship features than fiddle with email templates.
Or start with:
10K+
Emails Generated
50+
Templates
5K+
Users
send-email.ts
1
await fetch('https://api.usemailsnap.com/emails/${templateId}/send', {
2
method: 'POST',
3
headers: {
4
'Authorization': 'Bearer sk_live_xxx',
5
'Content-Type': 'application/json',
6
},
7
body: JSON.stringify({
8
to: customer.email,
9
context: {
10
orderNumber: '12345',
11
items: order.items,
12
total: order.total,
13
},
14
}),
15
});
15 credits free · No credit card · Send via any SMTP
How it works
1
Describe your email
Tell us what you need and we generate a clean React Email template. Refine it through chat or edit the code directly.
2
Connect your email provider
Add your SMTP credentials (SendGrid, Mailgun, AWS SES, or any provider). Or use test mode to try it out first.
3
Send via API
Call our API with your template ID and variables. We render and deliver through your configured provider.
What you ask for → What you get
From natural language to production-ready code
Your prompt
"Create a welcome email for new users with: - A friendly greeting using their first name - 3 quick tips to get started - A prominent CTA button to complete their profile - Our social links in the footer"
Generated code
WelcomeEmail.tsx
1
import {
2
Body,
3
Button,
4
Container,
5
Head,
6
Heading,
7
Html,
8
Link,
9
Preview,
10
Section,
11
Text,
12
} from '@react-email/components';
13
14
interface WelcomeEmailProps {
15
firstName: string;
16
profileUrl: string;
17
}
18
19
export const WelcomeEmail = ({ firstName, profileUrl }: WelcomeEmailProps) => (
20
<Html>
21
<Head />
22
<Preview>Welcome to Acme - Let's get you started</Preview>
23
<Body style={main}>
24
<Container style={container}>
25
<Heading style={h1}>Welcome, {firstName}!</Heading>
26
<Text style={text}>
27
We're excited to have you on board. Here are 3 tips to get started:
28
</Text>
29
<Section style={tips}>
30
<Text style={tip}>1. Complete your profile</Text>
31
<Text style={tip}>2. Explore the dashboard</Text>
32
<Text style={tip}>3. Invite your team</Text>
33
</Section>
34
<Button style={button} href={profileUrl}>
35
Complete Your Profile
36
</Button>
37
</Container>
38
</Body>
39
</Html>
40
);
Your first 15 generations are free
No credit card required. Start building better emails today.