skills.rest
pipixia-labs
pipixia-labsOFFICIAL
Explore all skills by this author →
GitHub

email-marketing

Generates a single HTML email from a design system.

38|3|Updated Apr 8, 2026
Search Tags:#newsletter#marketing#email#design-system#template-design#html-email
One-click install
npx skills add https://github.com/pipixia-labs/creative-claw --skill email-marketing-pipixia-labs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: email-marketing
Source: https://github.com/pipixia-labs/creative-claw/tree/main/skills/design-knowledge-and-skills/skills/email-marketing
Command: npx skills add https://github.com/pipixia-labs/creative-claw --skill email-marketing-pipixia-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates the tedious manual work of building brand-consistent marketing emails, enabling faster campaigns with consistent design and fewer HTML errors.

Core Features & Use Cases

  • Automated HTML email layout: masthead, hero, eyebrow, headline lockup, body, CTA, specs grid, and footer.
  • Design-system-driven: enforces color, typography, layout, and components per the DS.
  • Use Case: Create a product-launch email for a new sneaker brand with a hero image, brief copy, and a prominent CTA.

Quick Start

Create a launch email for a sporty running shoe brand — masthead, hero, big headline lockup, specs grid, CTA.

Frequently Asked Questions about email-marketing

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

FAQPage Schema
How do I automate brand-aligned HTML email generation for marketing campaigns?▼

Automate HTML email generation by using a design-system-driven workflow that requires a DESIGN.md file to enforce brand colors, typography, and layout. This outputs a single, ready-to-deploy HTML document with masthead, hero, body, and footer components.

What do I need to create a product launch email with consistent design?▼

To create a product launch email, you need a DESIGN.md file describing your design system. This guides the automated layout of a centered 600–680px column containing the masthead, hero, eyebrow, headline lockup, specs grid, and CTA.

Does this HTML email workflow support newsletter and promotional blast layouts?▼

Yes, the HTML email workflow supports newsletters, product launches, and promotional blasts. It automatically generates the masthead, hero, headline lockup, body copy, specs grid, and footer within a standardized 600–680px centered column layout.

What is the best way to enforce design system rules in marketing emails?▼

Enforce design system rules in marketing emails by providing a DESIGN.md file that defines your color, typography, and layout components. The generation process reads this file to produce a brand-aligned HTML document, reducing manual HTML errors.

Do I need to manually code the masthead and specs grid for my campaign emails?▼

No, you do not need to manually code the masthead or specs grid. The automated workflow generates these structural components, along with the hero, eyebrow, headline lockup, body, CTA, and footer, directly from your design system specifications.

Can I use this approach to build a 600px wide newsletter template?▼

Yes, you can build a 600px wide newsletter template. The workflow automatically structures your content into a centered 600–680px column, applying design-system-driven components like the masthead, hero, and footer for a ready-to-deploy HTML file.

Related Skills

Explore More Marketing & Sales Skills→
fengjutianfengjutian

stitch-design-taste

Generate DESIGN.md files defining visual and interaction standards for Google Stitch.

Community
Advanced
1479089714790897
7

kwp-marketing-email-sequence

Design multi-email marketing sequences with copy, timing, and branching logic.

Community
Intermediate
PiercingXXPiercingXX
1

email-marketing

Generate single-column HTML email layouts with inline CSS and design-system tokens.

Community
Intermediate
oakossoakoss
14

react-email

Create responsive HTML emails from React components with inline CSS or Tailwind.

Official
Intermediate