Skip to main content

​
Overview

Upload a screenshot of any email or design mockup, and Migma’s AI recreates it as pixel-perfect, responsive HTML. Perfect for recreating competitor emails, converting design mockups, or bringing inspiration to life.

High-Fidelity Recreation

Higher fidelity extraction, smarter layouting, better CTA mapping

Any Image Source

Screenshots, mockups, photos, competitor emails

Two Clone Modes

Exact recreation or brand-adapted version

​
How Image Cloning Works

Migma’s advanced computer vision and AI analyzes your image to understand:
  • Header, body, footer sections
  • Column layouts and grids
  • Element positioning and spacing
  • Visual hierarchy
  • Colors and gradients
  • Typography styles and sizes
  • Button designs and CTAs
  • Icons and decorative elements
  • Headline and body text (OCR)
  • CTA button text
  • Links and navigation
  • Image placements
  • Logo detection
  • Brand color identification
  • Design patterns
  • Visual style

​
Two Cloning Modes

​
Mode 1: Exact Clone

Recreates the image exactly as shown, without applying your brand. Best for:
  • Analyzing competitor emails
  • Converting existing designs without modification
  • Template migration from other platforms
  • Learning from successful email examples
Result: HTML that matches the original image as closely as possible.

​
Mode 2: Brand-Adapted Clone

Recreates the structure and layout but applies your brand colors, fonts, and style. Best for:
  • Getting inspiration from competitors
  • Adapting templates to your brand
  • Converting generic templates
  • Maintaining layout while staying on-brand
Result: Same structure, your branding.

​
Step-by-Step: Clone an Email from Image

1

Navigate to Create Page

Go to the main Create page at migma.ai/create
2

Upload Your Image

Click the image upload icon or drag and drop your fileSupported formats:
  • JPG, PNG, WebP
  • Max file size: 10MB
  • Recommended: High-resolution screenshots (1200px+ width)
3

Select Clone Mode

Choose your cloning approach:Exact Clone:
Recreate this email exactly as shown without using project information
Brand-Adapted:
Recreate this email layout but apply my brand colors, fonts, and style
4

Add Context (Optional)

Provide additional instructions:
Focus on the header layout and CTA placement
Make it mobile-responsive
Ensure all links are clickable
5

Generate

Click Generate and wait 30-60 seconds for AI to analyze and recreate
6

Review & Refine

Review the generated HTML in the chat interface and make adjustments:
The spacing between sections should be larger
Make the CTA button more prominent
Use our brand purple instead of this blue
7

Export

Download HTML or export to your ESP

​
What Images Work Best

​
Ideal Source Images

  • Email Screenshots
  • Design Mockups
  • Web Email Archives
  • Photos of Screens
Best source for cloning:
  • Full email screenshots from Gmail, Outlook, etc.
  • Newsletter examples from your inbox
  • Competitor promotional emails
  • Marketing emails from brands you admire
Tip: Take screenshots in desktop email clients for best results

​
Image Quality Guidelines

High resolution (1200px+ width recommended)
Clear text that’s readable
Good contrast between text and background
Full email visible (header to footer)
Minimal compression artifacts
Avoid:
  • Blurry or pixelated images
  • Heavily compressed JPGs
  • Cropped sections (upload full email)
  • Images with watermarks covering content
  • Multiple emails in one image

​
Advanced Cloning Techniques

​
Combine Image + Text Prompt

Get better results by combining image upload with descriptive text: 
[Upload competitor email screenshot]

Recreate this layout but:
- Use our brand colors (purple and gold)
- Replace their product with our AI email tool
- Keep the same 3-column feature section
- Make the hero image full-width instead of contained
- Use our friendly, professional tone

​
Clone Multiple Sections

Upload images of different email sections and combine them: 
[Upload hero section from Email A]
[Upload feature grid from Email B]

Create an email using:
- The hero layout from the first image
- The feature section design from the second image
- Apply my brand styling
- Connect them with smooth transitions

​
Iterative Refinement

Clone, then refine in steps: Initial prompt: 
Clone this email exactly
Refinement 1: 
Now adapt it to my brand colors
Refinement 2: 
Make the CTA buttons larger and more prominent
Refinement 3: 
Add a testimonial section after the features

​
Common Use Cases

Workflow:
  1. Screenshot competitor emails from your inbox
  2. Upload to Migma with “exact clone” mode
  3. Analyze structure, copy, and CTAs
  4. Create brand-adapted version for your campaigns
Tip: Build a swipe file of successful emails to clone and adapt
Workflow:
  1. Designer creates mockup in Figma/Sketch
  2. Export as high-res PNG
  3. Upload to Migma for HTML conversion
  4. Review with designer for accuracy
  5. Export production-ready HTML
Tip: Faster than manual coding, especially for one-off designs
Workflow:
  1. Screenshot emails from old ESP
  2. Upload to Migma
  3. Clone with exact recreation
  4. Export to new ESP format
  5. Adapt branding as needed
Tip: Migrate entire template libraries quickly
Workflow:
  1. Find inspiring emails on ReallyGoodEmails or Pinterest
  2. Screenshot your favorites
  3. Upload with brand-adapted mode
  4. Get your version in 30 seconds
  5. Refine and send
Tip: Build a collection of go-to layouts

​
Cloning Accuracy

​
What Migma Clones Perfectly

Layout structure and sections
Color schemes and gradients
Typography hierarchy
Button styles and CTAs
Image placements and sizes
Spacing and padding patterns
Column layouts and grids

​
What May Need Refinement

OCR-Dependent Elements:
  • Small or stylized fonts may need text correction
  • Overlaid text on busy images might be imperfect
  • Very long blocks of text may need proofreading
Solution: Review and edit text in the chat refinement step
Complex Visuals:
  • Custom illustrations (will be placeholder)
  • Animated GIFs (static version cloned)
  • Complex gradients (simplified)
  • Product photos (generic placeholder, replace with yours)
Solution: Upload your actual images after generation

​
Image Cloning vs Figma Import

When should you use each?
FeatureImage CloneFigma Import
Speed⚡⚡⚡ 30-60 sec⚡⚡ 60-90 sec
Accuracy⭐⭐⭐⭐ Very High⭐⭐⭐⭐⭐ Highest
Text ExtractionOCR-basedPerfect (from Figma)
Color Accuracy⭐⭐⭐⭐ Near-perfect⭐⭐⭐⭐⭐ Exact hex values
Best ForScreenshots, mockups, competitor emailsOriginal Figma designs
Setup RequiredNoneFigma file access
General Rule: Use Figma import for original designs, image clone for everything else.

Figma Import Guide

Learn how to import directly from Figma files

​
Tips for Best Results

Capture the entire email from header to footer in one screenshot. Migma understands full context better than fragments.Pro tip: Use browser extensions like “Full Page Screen Capture” for long emails
If possible, take screenshots on retina/HiDPI displays. Higher resolution = better OCR and detail extraction.
Screenshot emails against clean backgrounds (white or solid color email clients work best).
Tell Migma what to focus on:
Pay special attention to the header layout
The key element is the three-column feature section
Make sure to preserve the CTA button style
Don’t expect perfection on first try. Use chat to refine:
The headline text should be larger
Move the logo to the left
Increase spacing between sections

​
Troubleshooting

Cause: Low resolution image or stylized fontsSolution:
  • Upload higher resolution image
  • Manually correct text in chat refinement
  • Provide the correct text in your prompt
Cause: Image compression or color profile differencesSolution:
Change the blue (#1E90FF) to match exactly #2563EB
Update all purple colors to #6D28D9
Cause: Complex overlapping elements or unusual layoutsSolution:
The layout should be two columns, not stacked
The hero image should be full-width at the top
Move the CTA section above the features
Cause: Elements blended into background or croppedSolution:
  • Re-upload with full email visible
  • Manually specify missing elements:
Add a social media icon section in the footer
Include an unsubscribe link at the bottom

​
Combining with Other Features

​
Clone + AI Image Generation

  1. Clone layout from image
  2. Replace generic images with AI-generated on-brand images
  3. Result: Professional layout with custom visuals

AI Image Generation

Learn how to generate on-brand images

​
Clone + Brand Adaptation

  1. Clone competitor email structure
  2. Apply your brand colors, fonts, logos
  3. Adjust messaging to your voice
  4. Result: Proven layout, your brand

​
Clone + Multi-Language

  1. Clone successful email design
  2. Generate in multiple languages
  3. Result: Localized campaigns with same proven structure

Multi-Language Guide

Create emails in 15+ languages

​
Next Steps

Figma Import

Import designs directly from Figma

Remix Emails

Reuse and adapt successful emails

Visual Editor

Edit cloned emails visually

Email Preflight

Test on 30+ devices before sending

​
Need Help?

Join Discord

Share your cloning results and get feedback

Watch Tutorials

Video guides on image cloning

Contact Support

Get help with complex cloning projects

API Docs

Automate image cloning via API