← All guides

Anthropic · Coding agent

Use PixelMCP in Claude Code

Generate site images, icons and illustrations straight from your terminal while you build.

Before you start: Claude Code installed (curl -fsSL https://claude.ai/install.sh | bash, or npm install -g @anthropic-ai/claude-code). You'll also need a PixelMCP account. Get 100 free credits
  1. 1

    Add the server

    Run this once. Use --scope user for every project, or --scope project to share it with your team via .mcp.json.

    claude mcp add --transport http --scope user pixelmcp https://pixelmcp.com/mcp
  2. 2

    Authenticate

    Start Claude Code, run /mcp, select pixelmcp and choose Authenticate. Your browser opens to sign in.

    /mcp
  3. 3

    Check it's connected

    The server should show as connected. You can also run:

    claude mcp list

Things to try

  • “Generate a hero image for this landing page that matches the colors in our Tailwind theme and save it to public/hero.png.”

  • “Make a square app icon in our brand colors and wire it up as the favicon.”

Menus change often. If a label here doesn't match what you see, look for “Connectors”, “MCP” or “Integrations” in Claude Code's settings, or check Anthropic's docs.