Home
DESIGN.mdStar on GitHub

Email for
developers

The best way to reach humans instead of spam folders. Deliver transactional and marketing emails at scale.

Colors
Surfaces
background
#000000
Page bg (dark-first)
canvas
#141517
Cards, panels
gray-2
#1b1b1b
Input bg, hover fills
gray-3
#2a2a2a
Borders, dividers
Text
gray-12
#f0f0f0
Primary text
gray-11
#a1a4a5
Secondary text
gray-10
#878d8f
Muted text
gray-9
#6e7679
Placeholders, labels
Status & Accent
green-bright
#62FFB3
Brand green, opened
green-solid
#00c758
Delivered, success
red
#fb2c36
Bounced, errors
amber
#f99c00
Pending, warning
blue
#3080ff
Links, info
Typography
ABC Favorit — Display
display
Email for developers
56px400Favorit
heading-lg
Reach humans, not spam folders
32px400Favorit
heading-md
First-class developer experience
20px500Favorit
Domaine Display — Editorial
editorial
We are a team of engineers who love building tools for other engineers. Our goal is to create the email platform we've always wished we had — one that just works.
24px400Domaine
Inter — UI
body
A simple, elegant interface so you can start sending emails in minutes. It fits right into your code with SDKs for your favorite programming languages.
14px400lh 1.5
caption
Receive real-time notifications directly to your server.
12px400lh 1.4
Commit Mono — Code
code
re_BvXc8K2mP5nNqLwT_9fJhRdYsEoGaUiZ3
13pxmonolh 1.6
code-italic
// powered by react-email — open source
13pxitalicmono
Components
12,847
Emails sent
↑ 8.3% vs yesterday
99.4%
Delivery rate
↑ 0.2%
43.1%
Open rate
↓ 1.4%
Buttons
Inputs
Status Badges
Delivered Opened Bounced Pending
Spacing
space-1
4px
space-2
8px
space-3
12px
space-4
16px
space-5
20px
space-6
24px
space-8
32px
Signature — Email Logs
Guardrails
DO
Keep UI near-monochrome — color serves status signals only
Use Commit Mono for all email addresses, API keys, IDs, and webhook endpoints
Use ABC Favorit for headings; Domaine Display for editorial prose moments
Prioritize delivery status visibility — it's the core product metric
DON'T
Add decorative gradients or illustrations — the product is the hero
Use orange/warm accents — Resend's only brand color is #62FFB3 green
Default to light mode — dark (#000) is the primary Resend experience
Expose raw bounce codes — translate to plain-language delivery messages