Default email templates look like defaults. Custom templates look like your brand.
Transactional emails that use provider defaults (plain links, generic formatting) create a disconnect between the product experience and the email experience. React Email solves this: write email templates in React, preview them in the browser, and send with any provider.
Email templates that are either plain-text defaults, HTML that breaks in email clients, or off-brand — and a need for consistently branded, well-rendered emails
Email HTML is a time capsule. Gmail and Outlook render HTML emails differently from browsers; the spec for email HTML is roughly equivalent to HTML 4 from the late 1990s. flex, grid, and many modern CSS properties don't work in email clients. Writing email HTML that renders consistently requires table-based layouts, inline styles, and extensive cross-client testing.
React Email:
React Email provides React components that compile to email-safe HTML. Write templates in a familiar React component API; the library handles the translation to email-compatible HTML.
import { Html, Head, Body, Container, Text, Button } from '@react-email/components';
export function WelcomeEmail({ firstName }: { firstName: string }) {
return (
<Html>
<Body>
<Container>
<Text>Hi {firstName}, welcome to the product.</Text>
<Button href="https://app.example.com">Get started</Button>
</Container>
</Body>
</Html>
);
}
The template previews in the browser during development. Send via Resend, SendGrid, Postmark, or any provider.
Email clients to test:
- Gmail (web)
- Gmail (iOS/Android)
- Apple Mail (macOS)
- Apple Mail (iOS)
- Outlook 2019
- Outlook 365
Litmus and Email on Acid provide automated cross-client rendering tests.
Common email types requiring custom templates:
Welcome email, email verification, password reset, subscription confirmation, payment receipt, trial expiration warning, team invitation, weekly digest.
Custom email templates built with React Email that render correctly across Gmail, Outlook, and mobile clients, matching the product's brand
React Email templates
for each email type in the product
Responsive layout
that works on mobile email clients
Dynamic content
(personalization, order details, etc.)
Preview setup
for reviewing templates in development
Provider integration
(Resend/SendGrid) for delivery
One honest number to start.
Fixed-scope, fixed-price. The number below is the starting point — final scope is built from your brief.
Custom email templates built with React Email that render correctly across Gmail, Outlook, and mobile clients, matching the product's brand
Three steps, every time.
The same repeatable engagement on every project. No surprises, no mystery, no billable ambiguity.
Brief & discovery.
We send you questions, then get on a call. Output: a written scope with every step, feature, and integration listed.
Build & ship.
Fixed schedule, weekly reviews. No scope creep unless you change the scope — and if you do, we reprice it transparently.
Warranty & retainer.
30-day warranty on every launch. Most clients stay on a monthly retainer for ongoing features and maintenance.
Why Fixed-Price Matters Here
Email template scope is defined by the number of template types. Fixed-price per template set.
Questions, answered.
Email templates in version control (same as application code). Changes go through the same review process. No drag-and-drop editor — templates are code, which makes them maintainable.
Resend: modern API, React Email integration, good DX. SendGrid: more mature, higher volume limits. Postmark: high deliverability, good for transactional. For most new applications: Resend.
Tell Ryel about your project.
Describe what you’re building and what outcome you need. You’ll have a written, fixed-price scope within the week.