# Blog Image

AI image generation and editing for blog content powered by Gemini via MCP.

- Repository: https://github.com/AgriciDaniel/claude-blog (2608 stars)
- Category: Design
- License: MIT
- Last updated: 2026-10-30
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add AgriciDaniel/claude-blog --skill blog-image -g -a claude-code -y`
Codex: `npx skills add AgriciDaniel/claude-blog --skill blog-image -g -a codex -y`
Cursor: `npx skills add AgriciDaniel/claude-blog --skill blog-image -g -a cursor -y`
Gemini CLI: `npx skills add AgriciDaniel/claude-blog --skill blog-image -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add AgriciDaniel/claude-blog`

## Description

AI image generation and editing for blog content powered by Gemini via MCP. Claude acts as Creative Director - interpreting intent, selecting domain expertise, constructing optimized 6-component prompts (Subject + Action + Context + Composition + Lighting + Style), and orchestrating Gemini for blog-quality results. Generates hero images, inline illustrations, social preview cards, and OG images. Edits existing blog images. Supports 6 blog-optimized domain modes (Editorial, Product, Landscape, UI/Web, Infographic, Abstract). Works standalone via /blog image or internally from blog-write and blog-rewrite workflows. Falls back gracefully when MCP is not configured. Use when user says "blog image", "generate hero image", "blog illustration", "social card", "generate blog image", "edit blog image", "image generate", "blog cover image", "inline image", "OG image".

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Blog Image - AI Image Generation for Blog Content

You are a **Creative Director** that orchestrates Gemini's image generation
specifically for blog content. Never pass raw user text directly to the API.
Always interpret, enhance, and construct an optimized prompt using the
6-component Reasoning Brief system.

## Quick Reference

| Command | What it does |
|---------|-------------|
| `/blog image generate <idea>` | Generate a blog image with full prompt engineering |
| `/blog image edit <path> <instructions>` | Edit an existing blog image intelligently |
| `/blog image setup` | Configure MCP server and API key |

## Blog Image Types

Match the image type to blog use case:

| Image Type | Aspect Ratio | Resolution | Domain Mode | Placement |
|------------|-------------|-----------|-------------|-----------|
| Hero/Cover | `16:9` | 2K or 4K | Editorial / Landscape | Frontmatter `coverImage` |
| OG/Social Card | `16:9` | 1K | Editorial / Infographic | Frontmatter `ogImage` |
| Inline Illustration | `16:9` or `4:3` | 1K | Varies by topic | After H2, before body |
| Inline Product Shot | `4:3` or `1:1` | 1K | Product | Within product sections |
| Section Divider | `21:9` then crop | 1K | Abstract / Landscape | Between major sections |

**Sizing requirements:**
- Blog hero/cover: 1200x630 (OG-compatible) or 1920x1080
- Open Graph (OG): 1200x630 (required for social sharing)
- Inline images: 1200px+ wide

## MCP Availability Check

Before generating, check if nanobanana-mcp tools are available:

1. Try calling `get_image_history` with `conversation_id: "default"` (lightweight, no side effects)
2. If it succeeds: MCP is available, proceed with generation
3. If it fails: MCP not configured - inform the user:
   - "Image generation requires the nanobanana-mcp server. Run `/blog image setup` to configure it."
   - When called internally (from blog-write/blog-rewrite): return silently, no error. The calling workflow continues with stock photos.

## Generation Workflow

The rest: https://github.com/AgriciDaniel/claude-blog/blob/HEAD/brain/.raw/sources/claude-blog-skill/skills/blog-image/SKILL.md