TamerinTECH

Claude Code Generate Images MCP — DevOps skill for Claude Code

DevOps community

Auto generate and insert image assets during UI coding in Claude Code, using an MCP server for Azure OpenAI gpt-image-1 and Flux-1.1 Pro.

How to install Claude Code Generate Images MCP

This entry records only its repository, not the path inside it, so there is no exact command to give. Open TamerinTECH/claude-code-generate-images-mcp and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Claude Code Generate Images MCP does

Auto generate and insert image assets during UI coding in Claude Code, using an MCP server for Azure OpenAI gpt-image-1 and Flux-1.1 Pro.

Alternatives in DevOps

  • MCP Boilerplate — A remote Cloudflare MCP server boilerplate with user authentication and Stripe for paid tools 1k ★
  • Codeg — Aggregate and browse AI coding agent sessions (Claude Code, Codex, Gemini CLI, etc.) in one place 850 ★
  • Chat — chat web app for teams, sass with user management and ratelimit, support chatgpt(openai & azure), claude, gemi 568 ★

README

Claude Code Image Generation MCP Server

**An open-source local MCP server for AI-powered image generation for your vibe coding development**

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![Node.js](https://img.shields.io/badge/node-%3E%3D18.0.0-brightgreen.svg)](https://nodejs.org/) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/TamerinTECH/claude-code-generate-images-mcp/pulls)

![Claude Code Image Generation Workflow](assets/claude-mcp-workflow.png)

A local MCP server that lets Claude Code (or other tools) to generate and save images directly into your project, while you vibe code. It connects to **Google Gemini (Nano Banana)** by default, or Azure OpenAI as an alternative. Gemini is fast, has a generous free tier, and works great for most use cases. Azure supports Flux 1.1 Pro and gpt-image-1 if you need more control.

What it is, and why it helps

  • One flow in your editor, you ask for a page or a feature, also ask for backgrounds, icons, or illustrations, the server writes assets into your repo, Claude uses them in code.
  • Fewer switches, no shuffling between design tools and file managers, you keep focus.
  • Consistent assets, prompts and folders are part of your workflow, so results stay organized.
  • Reproducible, assets live with your code, easy to review and update.

You can build a full website with hero background and section art, create app icons and onboarding illustrations, or ship internal tools that still look clean and professional.


Quick start, installer

**Linux / macOS / WSL**

git clone https://github.com/TamerinTECH/claude-code-generate-images-mcp.git
cd claude-code-generate-images-mcp
./install.sh

**Windows PowerShell**

git clone https://github.com/TamerinTECH/claude-code-generate-images-mcp.git
cd claude-code-generate-images-mcp
.\install.ps1

**Windows PowerShell (if scr