Penpot's MCP Server provides an integration layer for Large Language Models (LLMs) to interact with Penpot design files via the Model Context Protocol (MCP). It enables LLMs to perform data queries, transformations, and creation operations on design elements, facilitating advanced design-to-design, code-to-design, and design-code workflows. This project is targeted at developers and power users seeking to leverage AI for enhanced design automation and manipulation within the Penpot ecosystem.

How It Works

The architecture comprises an MCP server and a Penpot MCP Plugin. The MCP server exposes tools to AI clients (LLMs), allowing them to retrieve, modify, and create design elements. Communication is established via WebSocket between the Penpot MCP Plugin and the MCP server. The plugin, running within Penpot, executes code leveraging the Penpot Plugin API, enabling LLMs to perform tasks directly within the design file's context by writing and executing arbitrary code snippets.

Quick Start & Requirements

• Primary install/run command: npm install followed by npm run bootstrap (installs dependencies, builds, and starts servers).
• Prerequisites: Node.js (v22 tested), npm, npx.
• Setup: Requires running the MCP server and plugin server locally, then loading the plugin in Penpot via http://localhost:4400/manifest.json and connecting it to the MCP server.
• Browser Connectivity: Chromium-based browsers (v142+) may require explicit user permission for private network access (PNA) when connecting to localhost from https://design.penpot.app.
• Links: Main Penpot repository: https://github.com/penpot/penpot/tree/develop/mcp

Highlighted Details

• Enables LLMs to perform design data queries, transformations, and creation operations.
• Supports design-to-design, code-to-design, and design-code workflows.
• Core components written in TypeScript for type-safe interactions with the Penpot Plugin API.

Maintenance & Community

This repository has been archived as of 2026-02-03 and its contents fully integrated into the main penpot/penpot repository. Active development and maintenance are now handled within that main project.

Licensing & Compatibility

The README does not explicitly state a license for this repository. As it is integrated into the main Penpot project, it likely inherits Penpot's license (typically Apache 2.0), but this should be verified in the main repository.

Limitations & Caveats

The project is archived, meaning this specific repository is no longer actively maintained. Users should refer to the main penpot/penpot repository for the latest version and ongoing development. Browser connectivity restrictions, particularly with newer Chromium versions, may require user intervention to establish WebSocket connections.