Design comprehensive email template systems with responsive specifications and client compatibility
Create an email template design system for [BRAND/COMPANY]. Brand Context: - Company: [COMPANY NAME] - Industry: [INDUSTRY] - Brand colors: [COLORS] - Brand fonts: [FONTS] - Email types needed: [MARKETING/TRANSACTIONAL/NEWSLETTER] Develop a comprehensive email design system: **1. Email Template Types** | Type | Purpose | Frequency | Key Elements | |------|---------|-----------|---------------| | Welcome | | | | | Newsletter | | | | | Promotional | | | | | Transactional | | | | | Re-engagement | | | | **2. Global Design Elements** *Header Module:* - Logo size and placement - Navigation links (if any) - Preheader text guidelines *Footer Module:* - Contact information - Social links - Unsubscribe link styling - Legal text - Address format **3. Typography Specifications** | Element | Font | Size | Color | Mobile Size | |---------|------|------|-------|-------------| | Headline | | | | | | Subheadline | | | | | | Body | | | | | | CTA | | | | | | Caption | | | | | (Include fallback fonts for email clients) **4. Color Application** - Background colors - Text colors - Link colors - Button colors - Divider colors **5. Button Styles** | Type | Background | Text | Border Radius | Padding | |------|------------|------|---------------|----------| | Primary | | | | | | Secondary | | | | | | Ghost | | | | | **6. Image Guidelines** - Hero image dimensions - Product image dimensions - Thumbnail sizes - Alt text requirements - Retina considerations **7. Layout Modules** *Single Column:* - Max width - Padding - Use cases *Two Column:* - Column widths - Gutter size - Mobile stack behavior *Card Module:* - Border styling - Internal padding - Shadow (if any) **8. Responsive Behavior** - Breakpoint(s) - Font size adjustments - Image scaling - Column stacking - Button sizing **9. Dark Mode Considerations** - Color overrides - Image treatments - Logo versions **10. Template Examples** Provide structure for: - Welcome email - Newsletter issue - Promotional blast - Order confirmation - Password reset **11. Email Client Compatibility** - Priority clients to support - Known issues and workarounds - Testing checklist
Create an email template design system for [BRAND/COMPANY]. Brand Context: - Company: [COMPANY NAME] - Industry: [INDUSTRY] - Brand colors: [COLORS] - Brand fonts: [FONTS] - Email types needed: [MARKETING/TRANSACTIONAL/NEWSLETTER] Develop a comprehensive email design system: **1. Email Template Types** | Type | Purpose | Frequency | Key Elements | |------|---------|-----------|---------------| | Welcome | | | | | Newsletter | | | | | Promotional | | | | | Transactional | | | | | Re-engagement | | | | **2. Global Design Elements** *Header Module:* - Logo size and placement - Navigation links (if any) - Preheader text guidelines *Footer Module:* - Contact information - Social links - Unsubscribe link styling - Legal text - Address format **3. Typography Specifications** | Element | Font | Size | Color | Mobile Size | |---------|------|------|-------|-------------| | Headline | | | | | | Subheadline | | | | | | Body | | | | | | CTA | | | | | | Caption | | | | | (Include fallback fonts for email clients) **4. Color Application** - Background colors - Text colors - Link colors - Button colors - Divider colors **5. Button Styles** | Type | Background | Text | Border Radius | Padding | |------|------------|------|---------------|----------| | Primary | | | | | | Secondary | | | | | | Ghost | | | | | **6. Image Guidelines** - Hero image dimensions - Product image dimensions - Thumbnail sizes - Alt text requirements - Retina considerations **7. Layout Modules** *Single Column:* - Max width - Padding - Use cases *Two Column:* - Column widths - Gutter size - Mobile stack behavior *Card Module:* - Border styling - Internal padding - Shadow (if any) **8. Responsive Behavior** - Breakpoint(s) - Font size adjustments - Image scaling - Column stacking - Button sizing **9. Dark Mode Considerations** - Color overrides - Image treatments - Logo versions **10. Template Examples** Provide structure for: - Welcome email - Newsletter issue - Promotional blast - Order confirmation - Password reset **11. Email Client Compatibility** - Priority clients to support - Known issues and workarounds - Testing checklist
This prompt is released under CC0 (Public Domain). You are free to use it for any purpose without attribution.
Explore similar prompts based on category and tags
Create detailed icon set design specifications with grid systems, construction rules, and export requirements
Analyze UI layouts for hierarchy, balance, accessibility, and provide actionable improvements
Write comprehensive motion design specifications for consistent, performant animations
Develop comprehensive responsive image strategies for web performance optimization