@singularity2045/image-generator-mcp-server NPM

DALL-E Image Generator MCP Server

Generate beautiful AI images using DALL-E 3 in any MCP-compatible application

🌟 Overview

This is a Model Context Protocol (MCP) server that brings OpenAI's DALL-E 3 image generation capabilities to any MCP-compatible application including Cursor, Claude Desktop, Windsurf, and more. With a simple function call, you can generate high-quality AI images and save them to any location on your filesystem.

💡 Fun fact: The logo for this project was generated using this very tool!

✨ Features

Powerful Image Generation: Uses OpenAI's state-of-the-art DALL-E 3 model
Direct Cursor Integration: Works seamlessly within your editor
Flexible Output Paths: Save images anywhere on your filesystem
Automatic Directory Creation: Directories are created if they don't exist
Smart File Extension Handling: .png extension is added automatically

🔄 Cross-Platform Compatibility

Since this is an MCP (Model Context Protocol) server, it's compatible with any application that supports the MCP protocol, not just Cursor!

Compatible Applications

Cursor: AI-powered code editor built on VS Code that features code generation, multi-file editing, codebase understanding, and chat interface
Claude Desktop: Anthropic's standalone Claude application
Windsurf: AI-powered integrated development environment (IDE) by Codeium
Cline: AI-powered coding assistant that integrates with IDEs as an autonomous agent
Any other MCP-compatible application

Simply follow the installation instructions for your specific platform, and the image generation capabilities will be available in any MCP-supporting tool you use!

📋 Requirements

Node.js 18 or higher
An OpenAI API key with DALL-E access

🚀 Quick Start

Installation

Option 1: Install from npm (Recommended)

# Install globally
npm install -g @singularity2045/image-generator-mcp-server

# Verify installation
image-generator --version

Option 2: Install from Source

# Clone the repository
git clone https://github.com/yourusername/image-generator-mcp-server.git
cd image-generator-mcp-server

# Install dependencies
npm install

# Build the project
npm run build

# Link globally
npm link

Configuration

Create a .env file in the project root:

OPENAI_API_KEY=your_openai_api_key_here

Platform-Specific Setup

Cursor

Add the server configuration to Cursor's config file:

MacOS/Linux: ~/.cursor/mcp.json
Windows: %USERPROFILE%\.cursor\mcp.json

{
  "mcpServers": {
    "dalle": {
      "command": "image-generator",
      "env": {
        "OPENAI_API_KEY": "your_openai_api_key_here"
      }
    }
  }
}

After configuration, restart Cursor for the tool to be available.

Claude Desktop

Add the server configuration to Claude Desktop's config file:

MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json
Windows: %APPDATA%/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "image-generator": {
      "command": "image-generator",
      "env": {
        "OPENAI_API_KEY": "your_openai_api_key_here"
      }
    }
  }
}

After configuration, restart Claude Desktop for the tool to be available.

Other MCP Applications

Most MCP-compatible applications have a similar configuration process:

Install and link the package globally as mentioned above
Configure the application to recognize the image-generator command
Set the OPENAI_API_KEY environment variable
Restart the application

Consult your specific application's documentation for detailed MCP server integration steps.

Using with Cursor Agent

Restart Cursor after installation, then it can be used by the Cursor Agent.

Cursor's AI assistant can be instructed to generate images for your projects through natural language prompts. This is especially powerful when building websites, creating assets, or designing UI elements.

Example Workflow

Ask the agent to generate an image for your project:

Create a hero image for my travel website featuring a tropical beach sunset

The agent will use the tool with appropriate parameters:

mcp_dalle_generate_image({
  prompt: "A stunning tropical beach at sunset with golden light reflecting on gentle waves, palm trees silhouetted against an orange and purple sky, perfect for a travel website hero image",
  outputPath: "/Users/yourusername/myproject/public/images/hero-sunset"
})

Use the generated image in your code:

The agent can help you incorporate the image into your project:

<div class="hero">
  <img src="/images/hero-sunset.png" alt="Tropical beach sunset" />
  <h1>Discover Paradise</h1>
</div>

Tips for Effective Image Generation with the Agent

Be specific about style: Mention "photorealistic," "cartoon," "minimalist," etc.
Describe the intended use: "for a logo," "for a button," "for a background"
Specify dimensions in your prompt: "create a wide banner image," "create a square profile picture"
Request variations: Ask the agent to generate multiple versions with slight prompt modifications
Include art direction: "in the style of Monet," "with vibrant colors," "with a dark, moody atmosphere"

Common Use Cases

Website Assets: "Generate icons for my navigation menu with a consistent blue theme"
UI Components: "Create button backgrounds with a subtle gradient"
Blog Images: "Generate a featured image for my article about machine learning"
App Mockups: "Create screen mockups for my fitness tracking app"
Placeholder Content: "Generate placeholder product images for my e-commerce site"
Marketing Materials: "Create social media banner images for my product launch"

During development, you can quickly iterate by asking the Cursor agent to modify existing images: "Generate a lighter version of the previous logo" or "Create the same image but in a different style."

📘 Documentation

Tool Reference

Function Naming

The function name will vary depending on how you've configured the MCP server in each application. The examples in this documentation use mcp_dalle_generate_image, but your specific configuration might result in a different function name.

`generate_image`

Generates an image based on a text prompt.

Parameters:

Parameter	Type	Description	Required
`prompt`	string	Text description of the image to generate	Yes
`outputPath`	string	Absolute path where to save the image	Yes

Returns:

A success message with the saved file path and generation details.

Example:

mcp_dalle_generate_image({
  prompt: "A futuristic city with flying cars and neon lights", 
  outputPath: "/Users/yourusername/Pictures/generated_images/future_city"
})

🛠️ Development

Setup Development Environment

# Install dependencies
npm install

# Build in watch mode for development
npm run watch

The Development Workflow

After making changes:

Build the project: npm run build
Link the package: npm link
Restart Cursor completely
Test your changes

⚠️ Important: Cursor only establishes connections to MCP servers at startup. Your changes won't take effect until Cursor is restarted, even if the tools appear to be working.

Project Structure

image-generator-mcp-server/
├── src/
│   ├── index.ts         # Main server implementation
│   ├── image-generator.ts # DALL-E API interaction
│   ├── file-saver.ts    # File system operations
│   └── types.ts         # TypeScript interfaces
├── build/               # Compiled JavaScript
├── .cursorrules         # Cursor rules for the project
├── package.json         # Project dependencies
└── README.md            # This file

🐛 Troubleshooting

Common Issues

"Not connected" errors: Make sure you've restarted Cursor after building/linking.
Image generation fails: Check that your OpenAI API key is valid and has DALL-E access.
Permission errors: Ensure you have write permissions for the target directory.

Debugging

You can use the MCP Inspector for debugging:

npm run inspector

⚠️ Warning: The Inspector has a timeout of 10 seconds. Since image generation often takes longer than this, you may see timeout errors. For testing the generate_image tool, it's best to test directly in Cursor after rebuilding and restarting.

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Fork the repository
Create your feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add some amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

📜 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

OpenAI for the DALL-E 3 API
The Model Context Protocol team for the MCP specification
Cursor team for the editor integration
Sammy Lebbie (sammyl720) for creating the initial version of this project that provided a starting point for our implementation
Claude, the AI assistant from Anthropic, who helped modernize this codebase and create this documentation

mcp dalle openai image-generation cursor claude

@modelcontextprotocol/sdk dotenv openai

0.1.2

4 months ago

0.1.1

4 months ago

0.1.0

4 months ago