email-template-builder

Create transactional email templates with React Email and multi-provider sending.

Updated Apr 16, 2026
One-click install
npx skills add https://github.com/devCharuzu/philfida-taskmanage --skill email-template-builder-devcharuzu
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: email-template-builder
Source: https://github.com/devCharuzu/philfida-taskmanage/tree/main/.windsurf/skills/email-template-builder
Command: npx skills add https://github.com/devCharuzu/philfida-taskmanage --skill email-template-builder-devcharuzu

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Email Template Builder unifies transactional email creation by providing reusable React Email templates, multi-provider sending, and a local preview server with i18n and dark mode support, enabling production-ready output for major providers.

Core Features & Use Cases

  • React Email templates (welcome, verification, password reset, invoice, notification, digest)
  • MJML templates for maximum email client compatibility
  • Multi-provider support with unified sending interface
  • Local preview server with hot reload
  • i18n/localization with typed translation keys
  • Dark mode support using media queries
  • Spam score optimization checklist
  • Open/click tracking with UTM parameters
  • Use cases include setting up transactional emails for new products, migrations, and adding new email types

Quick Start

Start by configuring your first template and wiring a provider, then run the preview server to see live results.

Frequently Asked Questions about email-template-builder

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build transactional emails with React templates?

You can build transactional emails with React templates by using React Email components to create reusable structures for welcome, verification, and invoice emails. This approach enables live preview, dark mode, and production-ready outputs across providers.

What is the best way to preview and test email deliverability before sending?

The best way to preview and test email deliverability is by running a local preview server with hot reload and a spam score optimization checklist. This pipeline validates rendering, dark mode, and deliverability before dispatching to providers.

Does React Email support i18n and dark mode for localized templates?

React Email supports i18n and dark mode by utilizing typed translation keys and media queries within the rendering pipeline. This ensures localized, production-ready emails render correctly across various email clients and user preferences.

Can I use a single sending interface for multiple email providers?

You can use a single provider-agnostic sending interface to dispatch emails across multiple providers. This unified interface standardizes the delivery workflow for transactional messages like notifications and digests without changing template code.

How do I track email open and click rates with UTM parameters?

You track email open and click rates by integrating analytics tracking with UTM parameters directly into the template rendering pipeline. This configures production-ready emails to capture engagement metrics upon delivery across providers.