Image Generator MCP Server

Generate placeholder images with specified dimensions and colors, and save them to a file path.

GitHub

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.

Features

  • 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

Installation

  1. Clone or download this repository
  2. Install dependencies:
npm install
  1. Build the server:
npm run build
  1. Add the server to your MCP configuration:

For VSCode:

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

For Claude Desktop:

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

Usage

The server provides one tool:

generate_test_image

Generate a test image with specified parameters.

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

Example:

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

Returns:

  • Text confirmation that the image was successfully generated and saved

Color Format

The tool supports hex color format:

  • Hex colors: #FF0000, #f00

Testing

Run the test script to verify the server works:

npm run build
npm test

Dependencies

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

Notes

  • 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

Contributing

Feel free to submit issues and enhancement requests!

Server Terkait