html-mail-builder

Generate cross-client HTML email templates with table layouts and inline CSS.

12|2|Updated Apr 21, 2026
One-click install
npx skills add https://github.com/haomingz/kimi-skills --skill html-mail-builder
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: html-mail-builder
Source: https://github.com/haomingz/kimi-skills/tree/main/skills/html-mail-builder
Command: npx skills add https://github.com/haomingz/kimi-skills --skill html-mail-builder

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Gmail、Outlook、Apple Mail 等主流客户端在渲染一致性方面存在挑战。本 Skill 使用 table 布局和 inline CSS,生成可在多大邮箱客户端中保持一致呈现的 HTML 邮件模板,降低手动样式调试成本。

Core Features & Use Cases

  • Table-based layout and inline CSS to ensure consistent rendering across Gmail, Outlook, and Apple Mail
  • Responsive design through media queries for mobile devices
  • 支持欢迎邮件、促销邮件、密码重置、通知邮件、订单确认等场景,方便快速创建营销与事务性邮件模板
  • 直接导出可用于邮件营销工具的可部署 HTML 内容

Quick Start

生成一个兼容 Gmail、Outlook 与 Apple Mail 的 HTML 邮件模板,并导出为 email.html

Frequently Asked Questions about html-mail-builder

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

FAQPage Schema
How do I make HTML emails render consistently across Outlook and Gmail?

To make HTML emails render consistently across Outlook and Gmail, use table-based layouts with inline CSS instead of modern div-based frameworks. This approach ensures structural compatibility and uniform styling by avoiding client-specific CSS rendering issues.

What is the best way to create responsive HTML email templates for mobile devices?

The best way to create responsive HTML email templates is by implementing media queries within your inline CSS. Media queries allow your email layout to adapt dynamically to different screen sizes while maintaining a table-based structure for broader client compatibility.

Why does my HTML email break in Outlook and how can I fix it?

HTML emails break in Outlook because it uses MSO rendering engines that lack support for modern CSS. Fix rendering issues by using table-based layouts, inline CSS, and adding MSO compatibility code to enforce structural consistency across Microsoft clients.

Can I generate transactional email templates like password resets using table layouts?

Yes, you can generate transactional email templates for password resets, order confirmations, and notifications using table layouts. Configurable HTML templates with inline CSS ensure these critical notices render properly across Gmail, Apple Mail, and Outlook.

Does generating cross-client HTML emails require external image URLs?

Cross-client HTML emails require external image URLs because most email clients block embedded attachments and base64 images. Linking externally hosted images ensures your visual content loads correctly across Gmail, Apple Mail, and Outlook.

How to export HTML email templates ready for marketing automation tools?

Export HTML email templates by generating a complete document with table-based layouts and inline CSS. The resulting HTML file can be directly deployed into email marketing tools for sending EDMs, newsletters, and promotional campaigns.