Image Generator MCP Server

A Model Context Protocol (MCP) server that generates test images with customizable width, height, and color. Saves images as PNG files to specified file paths.

- Generate test images with specified dimensions (1-4096 pixels)
- Support for hex color format (e.g., #FF0000, #f00)
- Automatic text overlay showing image dimensions
- Optional custom label text displayed in the top-left corner
- Smart contrast color selection for readable text
- Saves images as PNG files to specified file paths
- Automatically creates directories if they don't exist
- Clone or download this repository
- Install dependencies:
- Add the server to your MCP configuration:

{ "servers": { "Image Placeholder Gen": { "type": "stdio", "command": "node", "args": [ "~/mcp_servers/image-gen/build/index.js" ] } } }

{ "mcpServers": { "image-gen": { "command": "node", "args": ["/path/to/image-gen/build/index.js"] } } }

Generate a test image with specified parameters.

- width(number): Width of the image in pixels (1-4096)
- height(number): Height of the image in pixels (1-4096)
- color(string): Color of the image as hex code (e.g., #FF0000 or #f00)
- filepath(string): Full path where the PNG image should be saved
- label(string, optional): Custom text to display in the top-left corner of the image

{ "name": "generate_test_image", "arguments": { "width": 400, "height": 300, "color": "#3498db", "filepath": "/tmp/test_image.png", "label": "My Custom Label" } }

- Text confirmation that the image was successfully generated and saved

Run the test script to verify the server works:

- Node.js canvas library for image generation
- Model Context Protocol SDK

- Maximum image dimensions are capped at 4096x4096 pixels for performance
- Generated images include dimension text overlay for easy identification
- Text color is automatically chosen for optimal contrast against the background
- The server automatically creates directories if they don't exist in the specified file path

Feel free to submit issues and enhancement requests!

This is a web browser that enables your coding agent, such as Claude Code, to visit websites on your behalf and assist you in identifying bugs or creating UI test cases.

Create crafted UI components inspired by the best 21st.dev design engineers.

AI-powered SVG animation generator that transforms static files into animated SVG components using the Allyson platform

Get access to MCP server SVG and MCP server PNG icons in your vibe-coding projects

An MCP server that allows AI assistants to interact with Adobe After Effects.

The industry-standard doctrine for safe, observable, and steerable AI agent UX — browse 10 principles, curated examples, and application guides via MCP.

Assists with aki-ui component development and usage.

745+ CSS3 animations and 9,000+ real SVG icons for AI coding agents. 10 MCP tools. Zero-clone setup via npx.

Access comprehensive documentation for Ant Design components, including examples, API references, and best practices.

Provides instant access to Apple's Human Interface Guidelines, with content auto-updated periodically.