react-email

Convert JSON specifications into HTML or plain-text emails using React Email components.

15.9k|859|Updated Jan 14, 2026
One-click install
npx skills add https://github.com/vercel-labs/json-render --skill react-email-vercel-labs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-email
Source: https://github.com/vercel-labs/json-render/tree/main/skills/react-email
Command: npx skills add https://github.com/vercel-labs/json-render --skill react-email-vercel-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams convert JSON-based UI specs into deployable email outputs (HTML or plain text) using React Email components, ensuring consistency and correctness across campaigns.

Core Features & Use Cases

  • Converts JSON specs into HTML or plain-text emails using @react-email/components and @json-render/react-email.
  • Provides a catalog/registry integration to render AI-generated specs with a standard component set.
  • Use cases include building transactional or marketing emails from JSON specs with accessible, responsive layouts.

Quick Start

Render a sample spec to HTML using the built-in registry.

Frequently Asked Questions about react-email

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

FAQPage Schema
How do I convert JSON specs into HTML emails?

To convert JSON specs into HTML emails, you need a catalog schema and a registry compatible with @json-render/react-email. This setup uses standard React Email components to render AI-generated JSON specifications into deployable HTML or plain-text outputs.

What is the best way to render transactional emails from JSON data?

Rendering transactional emails from JSON data is best handled by using React Email components mapped through a JSON rendering registry. This approach translates JSON specifications into accessible, responsive HTML emails that display consistently across various email clients.

Can I use React Email components to generate plain-text emails from JSON?

Yes, you can use React Email components to generate plain-text emails from JSON specifications. A compatible registry processes the JSON input and renders it into either HTML or plain-text formats, supporting both marketing and transactional email workflows.

Do I need a specific registry to render AI-generated email specs?

Yes, you need a registry compatible with @json-render/react-email to render AI-generated email specs. This registry integrates a standard component set and the necessary rendering APIs to ensure your JSON specifications convert correctly into email outputs.

How does JSON rendering ensure consistency across different email clients?

JSON rendering ensures consistency across email clients by routing JSON specifications through a standardized registry of React Email components. This process enforces accessible and responsive layouts, so the generated HTML renders uniformly regardless of the target platform.

When should I use a JSON-based workflow for marketing emails?

You should use a JSON-based workflow for marketing emails when you need to turn AI-generated UI specs into deployable campaigns consistently. This method requires a catalog schema and standard components to guarantee correctness and responsive layout across clients.