Advertise
MCP.so
Sign In

Penpot MCP Server

@montevive

Repository

Basic information

Category

Developer Tools

Transports

stdio

Author

montevive

Submitted by

JM Robles

About Penpot MCP Server

Penpot MCP is a revolutionary Model Context Protocol (MCP) server that bridges the gap between AI language models and Penpot, the open-source design and prototyping platform. This integration enables AI assistants like Claude (in both Claude Desktop and Cursor IDE) to understand,

#penpot#design2code#code#ui#ux

Penpot MCP Server config

Add this server to your MCP-compatible client using the configuration below.

{
  "mcpServers": {
    "penpot": {
      "command": "uvx",
      "args": [
        "penpot-mcp"
      ],
      "env": {
        "PENPOT_API_URL": "https://design.penpot.app/api",
        "PENPOT_USERNAME": "your_penpot_username",
        "PENPOT_PASSWORD": "your_penpot_password"
      }
    }
  }
}

Penpot MCP Server tools

10

Retrieve a list of all available Penpot projects.

Get all files contained within a specific Penpot project. Args: project_id: The ID of the Penpot project

Retrieve a Penpot file by its ID and cache it. Don't use this tool for code generation, use 'get_object_tree' instead. Args: file_id: The ID of the Penpot file

Export a Penpot design object as an image. Args: file_id: The ID of the Penpot file page_id: The ID of the page containing the object object_id: The ID of the object to export export_type: Image format (png, svg, etc.) scale: Scale factor for the exported image

Get the object tree structure for a Penpot object ("tree" field) with rendered screenshot image of the object ("image.mcp_uri" field). Args: file_id: The ID of the Penpot file object_id: The ID of the object to retrieve fields: Specific fields to include in the tree (call "penpot_tree_schema" resource/tool for available fields) depth: How deep to traverse the object tree (-1 for full depth) format: Output format ('json' or 'yaml')

Search for objects within a Penpot file by name. Args: file_id: The ID of the Penpot file to search in query: Search string (supports regex patterns)

Provide the Penpot API schema as JSON.

Provide the Penpot object tree schema as JSON.

Return a rendered component image by its ID.

List all files currently stored in the cache.

Overview

What is Penpot MCP?

Penpot MCP is a Model Context Protocol (MCP) server that connects AI language models (like Claude) with the Penpot open-source design and prototyping platform. It enables AI-powered design analysis, automation, and natural language interaction with Penpot files.

How to use Penpot MCP?

Install via pip install penpot-mcp or uvx penpot-mcp, then run penpot-mcp or uv run penpot-mcp. Configure a .env file with Penpot API credentials (PENPOT_API_URL, PENPOT_USERNAME, PENPOT_PASSWORD). Integrate with Claude Desktop or Cursor IDE by adding the server’s MCP configuration.

Key features of Penpot MCP

  • Full MCP protocol compliance
  • Direct real-time access to Penpot API
  • AI-powered design component analysis
  • Automated export of assets in multiple formats
  • Design system compliance validation
  • Native Claude Desktop and Cursor IDE integration

Use cases of Penpot MCP

  • Automate design reviews with instant AI feedback on accessibility and usability
  • Generate documentation for design systems automatically
  • Check brand guideline compliance across projects
  • Bridge design-to-code workflows with AI assistance
  • Track design system adoption and component usage analytics

Frequently asked questions

1

What are the prerequisites to use Penpot MCP?

Python 3.12+, a Penpot account, and optionally Claude Desktop or Cursor IDE for AI integration.

2

Where do I put my Penpot credentials?

Create a `.env` file with `PENPOT_API_URL`, `PENPOT_USERNAME`, and `PENPOT_PASSWORD` variables.

3

What MCP tools are available?

Tools include `list_projects`, `get_project_files`, `get_file`, `export_object`, `get_object_tree`, and `search_object`.

4

How do I integrate with Claude Desktop?

Add the MCP server configuration (command, args, env) to Claude Desktop’s config file (`claude_desktop_config.json`).

5

Can I run the server locally from source?

Yes, clone the repository, create a virtual environment, and install with `pip install -e .` or `uv sync`.

Comments

More Developer Tools MCP servers

Capgo MCP

Cap-go

Console, Backend and CLI to manage Capgo Instant update and Native build for Capacitor apps Build and upload to app store your mobile app

Casefile

azimov777

One case file per task — shared by every session, agent and person that touches it. Self-hosted MCP server and live board. MIT.

3

Foremerge

naw103

Catch intent conflicts before code conflicts. The open-source coordination protocol for coding agents, built above Git.

50

offprompt

offprompt

MCP server that lets Claude Code, Cursor or Codex ask you for API keys on a local page and write them to .env. The agent only ever sees key names.

2

Instatus

Instatus, Inc.

Official Instatus MCP server. Ask what's down and why a monitor is failing, measure uptime for a period, see what went down and for how long, post and resolve incidents, schedule maintenance, put up general notices, see

Advertise