Transactional Email Templates and Delivery
Build React Email templates with provider wiring, previews, localization, dark mode, and delivery verification.
Before & after
Same prompt, same agent — the only difference is the skill.
Transactional email is core to product experience. You'd want to think about templates for onboarding, password resets, notifications, confirmations, receipts, and lifecycle sends. Design considerations include mobile responsiveness, dark mode, accessibility, spam optimization, internationalization. Which email provider are you using? What's your tech stack? Do you have existing brand guidelines for email?
Delivers COMPLETE TRANSACTIONAL EMAIL SYSTEM: React Email templates: mobile-responsive, dark-mode compatible, provider integration: Resend, Postmark, SendGrid, AWS SES with connection instructions, PREVIEW SERVER for QA before send, INTERNATIONALIZATION SETUP: i18n structure for multiple languages, SPAM OPTIMIZATION: DKIM/SPF/DMARC hints, list-unsubscribe headers, and ANALYTICS TRACKING: open/click pixels. Returns folder structure with all templates, validation rules, and testing checklist. Activates automatically when the request matches email-template-builder. Chains with developer workflow skills.
About this skill
Your password-reset email looks fine in a browser, breaks in an inbox, and sometimes sends twice after a timeout. This skill builds the React Email templates and sending path together, with plain-text alternatives, provider isolation, safe retries, localization, and evidence-based delivery checks.
What it does
- Builds typed React Email templates for resets, verification, receipts, invitations, and account notices.
- Wires Resend, Postmark, SendGrid, or AWS SES behind a provider adapter that preserves message content during migrations.
- Sets up local previews and fixtures for missing names, long content, expired links, and translated text.
- Handles email-client layout limits, accessibility, image blocking, and unpredictable dark-mode transformations.
- Defines duplicate prevention, bounded retries, signed webhook processing, and suppression handling.
- Separates successful rendering, provider acceptance, recipient-server delivery, and observed inbox placement.
What you get
Implementation code sized to your request: a single repaired template or a complete transactional email module with preview instructions, configuration, fixtures, and a verification checklist. Checks distinguish observed results from work that still needs credentials, DNS access, or real inbox testing.
Best for
Developers adding product emails, migrating providers, or repairing transactional templates that fail outside the preview browser.
SKILL.md preview
---
name: transactional-email-templates-and-delivery
description: Builds transactional email systems with typed React Email templates, provider adapters, HTML and plain-text rendering, localization, previews, and delivery diagnostics. Use when the user says "add transactional emails", "build a React Email template", "migrate from SendGrid to Resend", "my reset emails keep sending twice", "this email breaks in Outlook", "add localized receipts", or "our emails send but never arrive".
---
# Transactional Email Templates and Delivery
… (sign up to view the full skill)More development skills
View all Development skills →Production Go: Concurrency, Services & Profiling
Production Go code with leak-free goroutines, context-correct services, wrapped errors, and pprof-driven performance fixes.
Backend Feature Build Plan
Builds one backend feature through gates: confirmed requirements, one-screen design, small tested slices, and a deploy/rollback handoff.
Consistent, Safe Application Logging
Adds structured, correlated logs with useful severity, safe fields, bounded volume, and targeted verification.
Reliable WebSocket Messaging and Scaling
Build WebSocket and Socket.IO systems with authorized rooms, reconnect recovery, bounded queues, and multi-node presence.