custom-email-html-template-review

Audits Blade-rendered email HTML for client compatibility and rewrites it with tables and inline styles.

1|Updated Apr 3, 2021
One-click install
npx skills add https://github.com/NaoyaMiyagawa/dotfiles --skill custom-email-html-template-review-naoyamiyagawa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: custom-email-html-template-review
Source: https://github.com/NaoyaMiyagawa/dotfiles/tree/main/.ai/skills/custom-email-html-template-review
Command: npx skills add https://github.com/NaoyaMiyagawa/dotfiles --skill custom-email-html-template-review-naoyamiyagawa

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Email HTML that works in a browser often breaks in Gmail, Outlook (Word HTML engine), Yahoo, or Apple Mail because those clients strip stylesheets, ignore flexbox/grid, and block scripts, SVG, and web fonts. This Skill audits rendered email HTML and produces prioritized fixes before messages are sent to real inboxes. ## Core Features & Use Cases - Compatibility audit: Classifies issues as blocker, high, medium, or low using a constraint checklist covering CSS, images, SVG, fonts, forms, links, tables, and dark mode, cross-checked against Can I email for specific features. - Rewrite guidance: Converts flex/grid layouts to nested tables, moves critical styles inline, replaces SVG and icon fonts with PNG, and fixes relative URLs to absolute HTTPS. - Blade source mapping: Maps rendered-HTML findings back to Laravel Blade mail views, flagging @vite bundled CSS, asset() relative URLs, and web-layout components that need email-specific partials. - Use Case: Before launching a Laravel notification campaign, render the mail Blade view with sample data, run the audit, and receive a severity-ranked issue table plus rewritten HTML that survives Outlook and Gmail. ## Quick Start Review this rendered email HTML from my Laravel Blade mail template for Gmail and Outlook compatibility and rewrite the parts that will break.

Frequently Asked Questions about custom-email-html-template-review

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

FAQPage Schema
How do I check if my email HTML works in Outlook and Gmail?

Audit the rendered HTML against an email constraint checklist covering CSS support, images, fonts, and layout, then cross-check borderline features on Can I email. For confirmation, run the result through tools like Litmus, Email on Acid, or HTML Email Check before sending.

How do I review a Laravel Blade email template for client compatibility?

Render the Blade view with representative data so conditionals and partials expand, then audit the final HTML. In the Blade source, remove @vite or linked CSS, convert asset() paths to absolute HTTPS URLs, and replace web-layout components with email-specific table partials.

Can I use flexbox or CSS grid in HTML emails?

Flexbox and CSS grid are unsafe for primary email layout, especially in Outlook's Word HTML engine. Use nested tables with align and valign attributes for structure, and inline styles for sizing and spacing instead.

Does SVG work in email clients?

Inline SVG is stripped or ignored by many email clients, and SVG loaded via an img tag is inconsistent. For broad compatibility, convert logos and diagrams to PNG with explicit width, height, and alt attributes.

Why do my email styles disappear in Gmail web?

Webmail clients often strip the head section, rewrite selectors, or scope class-based CSS so rules misfire. Move critical visual rules to inline style attributes on each element and keep any style block limited to resets or media queries.

Can I embed video or forms in an HTML email?

Video, audio, iframes, and forms are not viable for broad email compatibility since most clients strip or block them. Use a still image linking to the video and a CTA link to a web form instead.