Penpot MCP Server
Enables AI agents to programmatically access self-hosted Penpot instances to read, create, modify, and export design elements through natural language. It provides 66 tools for managing projects, shapes, design tokens, and comments using a dual-acces
What is Penpot MCP Server?
Penpot MCP Server is a Model Context Protocol (MCP) server that allows AI assistants like Claude, Cursor, and VS Code to enables ai agents to programmatically access self-hosted penpot instances to read, create, modify, and export design elements through natural language. it provides 66 tools for managing projects, shap...
Enables AI agents to programmatically access self-hosted Penpot instances to read, create, modify, and export design elements through natural language. It provides 66 tools for managing projects, shapes, design tokens, and comments using a dual-acces
This server falls under the Browser Automation category on MCPgee, the world's largest MCP server directory with 33,000+ servers.
Features
- Enables AI agents to programmatically access self-hosted Pen
Use Cases
Maintainer
Works with
Installation
Manual Installation
npx penpot-mcp-serverConfiguration
Configuration Details
claude_desktop_config.json
Performance
Response Metrics
Resource Usage
How to Set Up and Use Penpot MCP Server
Penpot MCP Server bridges AI assistants with your self-hosted Penpot design tool, exposing over 66 tools for reading, creating, modifying, and exporting design elements entirely through natural language. It connects directly to a Penpot instance via the REST API using username/password authentication and lets you manage projects, navigate file hierarchies, search for components, inspect shape trees, and export objects as images — all without opening the Penpot UI. Designers and front-end teams can use it to automate repetitive design tasks, extract design token values, and build AI-driven design workflows.
Prerequisites
- Python 3.10+ and pip or uv installed
- A running Penpot instance (self-hosted or design.penpot.app)
- A Penpot account with username and password
- An MCP-compatible client such as Claude Desktop or Cursor
Install the Penpot MCP package
Install penpot-mcp from PyPI using pip or uv. The uv/uvx method is recommended for zero-setup execution.
pip install penpot-mcp
# Or with uv (recommended):
uv add penpot-mcpCreate a .env file with your Penpot credentials
Set your Penpot API URL, username, and password. The default API URL points to the public Penpot cloud instance; change it for self-hosted deployments.
PENPOT_API_URL=https://design.penpot.app/api
[email protected]
PENPOT_PASSWORD=your_penpot_passwordTest the connection
Run a quick API test to confirm credentials work before wiring up the MCP client.
python -m penpot_mcp.api.penpot_api --debug list-projectsAdd the server to your MCP client configuration
Register the Penpot MCP server in your claude_desktop_config.json using uvx so no manual path management is needed.
{
"mcpServers": {
"penpot": {
"command": "uvx",
"args": ["penpot-mcp"],
"env": {
"PENPOT_API_URL": "https://design.penpot.app/api",
"PENPOT_USERNAME": "[email protected]",
"PENPOT_PASSWORD": "your_password"
}
}
}
}Restart your MCP client and verify tools
Restart Claude Desktop or your client. You should see tools including list_projects, get_project_files, get_file, export_object, get_object_tree, and search_object.
Penpot MCP Server Examples
Client configuration
Complete claude_desktop_config.json entry for Penpot MCP using uvx with credentials passed as environment variables.
{
"mcpServers": {
"penpot": {
"command": "uvx",
"args": ["penpot-mcp"],
"env": {
"PENPOT_API_URL": "https://design.penpot.app/api",
"PENPOT_USERNAME": "[email protected]",
"PENPOT_PASSWORD": "your_secure_password"
}
}
}
}Prompts to try
Example prompts to manage and explore Penpot design files through the MCP server.
- "List all my Penpot projects and their files."
- "Find all button components in the Design System file."
- "Export the hero section shape from the Landing Page file as a PNG."
- "Show me the object tree for the Homepage frame so I can see its layer structure."
- "Search for any component named 'Card' across my projects."Troubleshooting Penpot MCP Server
API requests are blocked or return 403 errors
The Penpot cloud instance (design.penpot.app) uses CloudFlare protection that may block automated requests. Log in through the web browser first to complete any CAPTCHA verification, then retry. For self-hosted instances this is not an issue.
Authentication fails with invalid credentials error
Confirm your PENPOT_USERNAME is the email address you use to log in (not a display name), and that PENPOT_PASSWORD matches exactly. Run python -m penpot_mcp.api.penpot_api --debug list-projects to see the raw error.
export_object returns an empty or corrupt image
Ensure the object ID is a valid UUID from get_object_tree or search_object. Exporting a container frame works best; exporting a group may require specifying child shape IDs individually.
Frequently Asked Questions about Penpot MCP Server
What is Penpot MCP Server?
Penpot MCP Server is a Model Context Protocol (MCP) server that enables ai agents to programmatically access self-hosted penpot instances to read, create, modify, and export design elements through natural language. it provides 66 tools for managing projects, shapes, design tokens, and comments using a dual-acces It connects AI assistants to external tools and data sources through a standardized interface.
How do I install Penpot MCP Server?
Follow the installation instructions on the Penpot MCP Server GitHub repository. Clone the repo, install dependencies, and add the server config to your AI client.
Which AI clients work with Penpot MCP Server?
Penpot MCP Server works with all major MCP-compatible AI clients including Claude Desktop, Claude Code, Cursor, VS Code (GitHub Copilot), Windsurf, and Cline.
Is Penpot MCP Server free to use?
Yes, Penpot MCP Server is open source and available under the MIT License license. You can use it freely in both personal and commercial projects.
Penpot MCP Server Alternatives — Similar Browser Automation Servers
Looking for alternatives to Penpot MCP Server? Here are other popular browser automation servers you can use with Claude, Cursor, and VS Code.
Chrome DevTools MCP
★ 40.6kAI-powered Chrome automation server with natural language element detection. Control Chrome browser through MCP protocol for testing, debugging, and performance analysis. Features 91% accuracy in element location, works with free AI models, and suppo
UI TARS Desktop
★ 34.9k📇 🏠 - Browser automation capabilities using Puppeteer, both support local and remote browser connection.
Playwright
★ 32.8kA production-ready browser automation server that enables AI assistants to interact with web pages using tools for navigation, element interaction, and data extraction. It features a built-in Inspector UI and robust crash recovery for reliable automa
Page Agent
★ 18.0kJavaScript in-page GUI agent. Control web interfaces with natural language.
Chrome
★ 11.7kAn extension-based MCP server that enables AI assistants to control your browser, leveraging existing sessions and login states for automation and content analysis. It provides over 20 tools for semantic tab search, interactive element manipulation,
LAMDA
★ 7.8kThe most powerful Android RPA agent framework, next generation mobile automation.
Browse More Browser Automation MCP Servers
Explore all browser automation servers available in the MCPgee directory. Each server includes setup guides for Claude, Cursor, and VS Code.
Set Up Penpot MCP Server in Your Editor
Choose your AI client for step-by-step setup instructions.
Quick Config Preview
Add this to your claude_desktop_config.json or .cursor/mcp.json
Ready to use Penpot MCP Server?
Browse our complete directory of 33,000+ MCP servers, read setup guides for your editor, and start building with the Model Context Protocol.