Image Generation via MCP

AI image generation skill via MCP. Use Gemini models or compatible services to generate high-quality images for marketing, UI, and presentations.

When to use this skill

• Marketing assets: Hero images, banners, social media content

• UI/UX design: Placeholder images, icons, illustrations

• Presentations: Slide backgrounds, product visualizations

• Brand consistency: Generate images based on a style guide

Instructions

Step 1: Configure MCP Environment

# Check MCP server configuration

claude mcp list

# Check Gemini CLI availability

# gemini-cli must be installed

Required setup:

• Model name (gemini-2.5-flash, gemini-3-pro, etc.)

• API key reference (stored as an environment variable)

• Output directory

Step 2: Define the Prompt

Write a structured prompt:

**Subject**: [main subject]

**Style**: [style - minimal, illustration, photoreal, 3D, etc.]

**Lighting**: [lighting - natural, studio, golden hour, etc.]

**Mood**: [mood - calm, dynamic, professional, etc.]

**Composition**: [composition - centered, rule of thirds, etc.]

**Aspect Ratio**: [ratio - 16:9, 1:1, 9:16]

**Brand Colors**: [brand color constraints]

Step 3: Choose the Model

Model

Use case

Notes

gemini-3-pro-image

High quality

Complex compositions, detail

gemini-2.5-flash-image

Fast iteration

Prototyping, testing

gemini-2.5-pro-image

Balanced

Quality/speed balance

Step 4: Generate and Review

# Generate 2-4 variants

ask-gemini "Create a serene mountain landscape at sunset,

  wide 16:9, minimal style, soft gradients in brand blue #2563EB"

# Iterate by changing a single variable

ask-gemini "Same prompt but with warm orange tones"

Review checklist:

• Brand fit

• Composition clarity

• Ratio correctness

• Text readability (if text is included)

Step 5: Deliverables

Final deliverables:

• Final image files

• Prompt metadata record

• Model, ratio, usage notes

{

  "prompt": "serene mountain landscape at sunset...",

  "model": "gemini-3-pro-image",

  "aspect_ratio": "16:9",

  "style": "minimal",

  "brand_colors": ["#2563EB"],

  "output_file": "hero-image-v1.png",

  "timestamp": "2026-01-21T10:30:00Z"

}

Examples

Example 1: Hero Image

Prompt:

Create a serene mountain landscape at sunset,

wide 16:9, minimal style, soft gradients in brand blue #2563EB.

Focus on clean lines and modern aesthetic.

Expected output:

• 16:9 hero image

• Prompt parameters saved

• 2-3 variants for selection

Example 2: Product Thumbnail

Prompt:

Generate a 1:1 thumbnail of a futuristic dashboard UI

with clean interface, soft lighting, and professional feel.

Include subtle glow effects and dark theme.

Expected output:

• 1:1 square image

• Low visual noise

• App store ready

Example 3: Social Media Banner

Prompt:

Create a LinkedIn banner (1584x396) for a SaaS startup.

Modern gradient background with abstract geometric shapes.

Colors: #6366F1 to #8B5CF6.

Leave space for text overlay on the left side.

Expected output:

• LinkedIn-optimized dimensions

• Safe zone for text

• Brand-aligned colors

Best practices

• Specify ratio early: Prevent unintended crops

• Use style anchors: Maintain consistent aesthetics

• Iterate with constraints: Change only one variable at a time

• Track prompts: Ensure reproducibility

• Batch similar requests: Create a consistent style set

Common pitfalls

• Vague prompts: Specify concrete style and composition

• Ignoring size constraints: Check target channel dimension requirements

• Overly complex scenes: Simplify for clarity

Troubleshooting

Issue: Outputs are inconsistent

Cause: Missing stable style constraints

Solution: Add style references and a fixed palette

Issue: Wrong aspect ratio

Cause: Ratio not specified or an unsupported ratio

Solution: Provide an exact ratio and regenerate

Issue: Brand mismatch

Cause: Color codes not specified

Solution: Specify brand colors via HEX codes

Output format

## Image Generation Report

### Request

- **Prompt**: [full prompt]

- **Model**: [model used]

- **Ratio**: [aspect ratio]

### Output Files

1. `filename-v1.png` - [description]

2. `filename-v2.png` - [variant description]

### Metadata

- Generated: [timestamp]

- Iterations: [count]

- Selected: [final choice]

### Usage Notes

[Any notes for implementation]

Multi-Agent Workflow

Validation & Retrospectives

• Round 1 (Orchestrator): Prompt completeness, ratio correctness

• Round 2 (Analyst): Style consistency, brand alignment

• Round 3 (Executor): Validate output filenames, delivery checklist

Agent Roles

Agent

Role

Claude

Prompt structuring, quality verification

Gemini

Run image generation

Codex

File management, batch processing

Metadata

Version

• Current Version: 1.0.0

• Last Updated: 2026-01-21

• Compatible Platforms: Claude, ChatGPT, Gemini, Codex

Related Skills

• frontend-design

• presentation-builder

• video-production

Tags

#image-generation #gemini #mcp #design #creative #ai-art