Penpot: What It Is, Key Features, and How to Get Started

What it is

Penpot is an open-source design and prototyping platform created by Kaleidos Subsidiary SL for digital product teams. The platform provides an integrated workspace where designers and software developers can collaborate on user interface mockups, wireframes, and interactive prototypes. Unlike conventional design applications that rely on proprietary data formats, Penpot is built directly upon open web standards, including SVG (Scalable Vector Graphics), CSS, HTML, and JSON, alongside an open file format.

The project is published under the Mozilla Public License 2.0 (MPL-2.0) and has been recognized as a verified Digital Public Good. Because Penpot is open source and deployment-agnostic, organizations maintain complete ownership and governance over their design assets and infrastructure. Teams can choose between working within a standard web browser on the cloud or hosting the platform locally on their private servers.

A guiding philosophy behind Penpot is connecting design work directly with web code. By framing visual layouts in the language of standard front-end technologies, designs correspond naturally to real-world code. Whether teams collaborate simultaneously in real time or operate independently, Penpot provides a flexible environment for managing interface creation from early concepts to scalable design systems.

What it can do

Penpot offers a wide range of capabilities designed to support product design, engineering alignment, and modern automation:

• Standards-Based Responsive Layouts (CSS Grid and Flex Layout): Penpot allows designers to construct responsive interfaces using native CSS Grid and Flexbox layout systems. In web development, Flexbox controls how items align and distribute space along a single axis, while CSS Grid organizes content across two dimensions using rows and columns. Creating layouts with these standards ensures that interface mockups behave and resize dynamically, mirroring how modern web browsers render live pages.
• Wireframes and Interactive Prototyping: Teams can map out early concepts using wireframes and build clickable, interactive prototypes. These prototypes allow stakeholders to preview screen transitions, navigate user flows, and validate interface behaviors before development begins.
• Design Systems, Components, and Design Tokens: The platform supports scalable design systems through reusable UI components and variants, which represent alternate states of a component (such as default, hover, or pressed buttons). In addition, Penpot includes native Design Tokens—variables that store foundational design values like color palettes, typography scales, and spacing metrics. According to the project README, these native design tokens establish a single source of truth between design and development, keeping design systems consistent across multiple projects and platforms.
• Code Inspection for Developers: Penpot includes a dedicated inspect mode that provides instant visibility into production-ready SVG, CSS, and HTML code. Software developers can click on any canvas element to view exact dimensions, colors, and layout rules, accelerating implementation without relying on manual design handoffs.
• Model Context Protocol (MCP) Server and AI Workflows: To accommodate artificial intelligence and autonomous workflows, Penpot includes an open Model Context Protocol (MCP) server. MCP is an open standard that allows large language models (LLMs) and AI agents to communicate directly with external applications. Through this integration, external AI tools can interact with the Penpot canvas across design-to-code, code-to-design, and design-to-design pipelines, enabling automated generation and layout adjustments.
• Extensibility via Plugins, Webhooks, and APIs: Penpot features a plugin architecture that lets developers customize the platform and integrate external tools into their design workflow. Teams can also connect Penpot to automated continuous integration pipelines using webhooks and an open REST API authenticated with access tokens.

How to get started

Getting started with Penpot can be done either through a hosted cloud workspace or by deploying a self-hosted instance on private infrastructure:

• Using the Cloud Service: Users can visit the official Penpot web application and register for a free account. Because the platform runs directly in the browser, creators can immediately start drafting layouts, creating project files, and inviting team members to collaborate in shared workspaces without downloading desktop software.
• Self-Hosting on Private Servers: Teams that require complete control over data privacy, compliance, and hosting environments can install Penpot on their own infrastructure. The project documentation outlines deployment pathways using container technologies such as Docker, Kubernetes, and Elestio. These methods allow technical administrators to run Penpot inside private enterprise networks or on-premise servers.
• Accessing Learning Materials: For those exploring the platform for the first time, Penpot provides educational resources, including an extensive user guide, technical documentation, developer diaries, video tutorials, and a dedicated UI design course. The community also maintains libraries and templates that can be imported to accelerate new interface projects.
• Joining the Community: Users can join the official Penpot community forum, which hosts dedicated discussion spaces for technical troubleshooting, user questions, product improvement suggestions, education, events, and localized language discussions. Users can also participate in the Penpot Ambassador program, translate the platform, report bugs via GitHub issues, or contribute code to the repository.

Pricing and requirements

Specific pricing tiers, commercial packages, and plan details are subject to the official Penpot website.

From an open-source perspective, Penpot’s source code is licensed under the Mozilla Public License 2.0 (MPL-2.0). The official hosted platform allows users to sign up for free.

For growing businesses with advanced administrative demands, the project offers a paid commercial tier called Penpot Enterprise. Available for both cloud and self-hosted environments, Penpot Enterprise provides centralized administration through an Admin Console, custom permissions management, and Single Sign-On (SSO) integration with enterprise identity providers.

In terms of operational requirements, Penpot is deployment agnostic:

• Client Requirements: Because Penpot is a web-based application, users only need an up-to-date web browser to access the editing canvas, prototype previews, and collaboration tools across desktop operating systems.
• Self-Hosting Requirements: Server administrators running a local or private instance require infrastructure capable of running containerized services and managing microservices, using platforms such as Docker or container orchestrators like Kubernetes.

Who it is for

Penpot is designed for a broad range of professionals and organizations involved in the software product lifecycle:

• UI and UX Designers: Designers who need a collaborative canvas for building wireframes, responsive UI components, and interactive prototypes using web-aligned layout engines like CSS Grid.
• Front-End Developers: Engineers who want a design tool that speaks web standards natively, providing instant access to inspectable HTML, CSS, and SVG code that reflects real styling mechanics.
• Cross-Functional Product Teams: Product managers, designers, and developers who rely on real-time multiplayer editing to keep everyone aligned throughout the product development process.
• Enterprises with Strict Compliance Standards: Organizations in regulated industries that require full infrastructure ownership, on-premise hosting, centralized user governance, and compliance controls without relying on proprietary third-party clouds.
• AI Tool Builders and Automation Engineers: Teams building agentic or automated software workflows that can connect directly to interface designs using the open MCP server and developer APIs.
• Open-Source Advocates: Creators who prioritize open standards, open formats, and digital public goods to maintain creative freedom and prevent vendor lock-in.

Alternatives

Excalidraw is an open-source whiteboard and diagramming tool.

Inkscape is an open-source vector graphics editor.

Sources

• Penpot GitHub Repository
• Penpot Official Website
• Excalidraw GitHub Repository
• Inkscape GitLab Repository