Penpot Tutorials

Learn how to set up a Penpot MCP Server Remote in just 5 minutes! In this quick and practical tutorial, you'll discover how to connect OpenCode as a client and use OpenRouter to manage model subscriptions efficiently. This setup is just an exam...

In this hands-on session, we’ll explain the basics of working with Penpot and agentic AI, get you set up with Penpot MCP (and explain what Model Context Protocol means!) Then we’ll look at some of the use cases for using AI workflows in the design...

We tested different AI design tools (Claude, Stitch, Figma, V0 and Penpot) with a complex UI prompt that required more than visual generation: "Design a real estate property card. The design should encourage a non-linear yet coherent visual jo...

Watch this Community Hours session to learn more about the Penpot Ambassador Program. What makes it unique? A peer-to-peer learning model and a collaborative, open library where take aways, resources, and real-world experiences are continuously...

Penpot is the first Open-Source design platform for seamless collaboration between designers and developers. Built on open standards, it gives teams flexibility, control, and aligns with values like transparency, inclusion, ownership, freedom, and...

This short video showcases how Penpot's MCP Server can assist in generating production-ready, semantic HTML and modular CSS from a specific Penpot board. Official Penpot MCP server, already available at https://github.com/penpot/penpot/tree/dev...

Penpot 2.14 brings major improvements to design token management, collaboration, and automation, making it easier for designers and developers to keep systems consistent and scalable. ✨ Juan de la Cruz, designer at Penpot, walks us through th...

Penpot Ambassador Program is live! Our ambassador program is a peer-to-peer learning network where designers, developers, educators connect and celebrate the open-source spirit. Penpot Ambassadors will build an open library full of insights th...

In this video, we explore the power of Penpot’s MCP, showing how a single prompt can automatically extract every possible variant of an Input Form and generate its full combinatorial matrix. What would normally require an enormous amount of man...

This short demo shows how Penpot's MCP Server can generate a new splash screen from a simple scribble, using the rest of the file's components and screens as a reference. Official Penpot MCP server, already available at https://github.com/pen...

Penpot MCP Server lets you connect unlimited AI agents directly into your workflow, and that workflow can be fully multidirectional. Go from design to code, code to design, design to design, and beyond. Expand it as far as your imagination take...

Do you ever feel overwhelmed by the number of design tokens you’re managing? To help you simplify, Marco-Christian Krenn from Tokens Studio joins us as a special guest for this hands-on demo. Together with Laura Kalbag, Penpot Educator, he’ll guid...

A brand-new unit just landed in the UI course with Penpot, and it’s all about color in UI design. It includes videos on how to work with color, covering color palette creation and a wide range of tips and practical techniques, such as saturating g...

Typography can determine the success of your design system because it defines the way users experience information and engage with your product. In this demo, Laura Kalbag—developer, designer, and educator at Penpot—will introduce you to typograph...

Deleting a file no longer means it’s gone forever. The Trash is a dedicated space in the dashboard where deleted files and projects live before being permanently removed. From here, you can recover content deleted by mistake or clean things up for...

Our second composite design token, the Shadow token, is now here. Until now, you couldn’t save shadows as reusable styles. Now you can create reusable, consistent drop shadows and inner shadows, made of one or multiple layers, fully tokenized and ...

In this video, Juan de la Cruz, designer at Penpot, walks you through our first product release of the year and what it means for designers and teams. This release includes: Recover deleted files from Trash and, Shadow tokens., 👉 Thi...

Sometimes the smallest interactions make the biggest impact. In this video, we introduce a customizable boolean toggle in the properties panel that lets you switch variant states instantly. With a single toggle, you can move between states in s...

Managing color design tokens just got easier. In this video, we explore how you can view and edit color tokens directly from the design properties panel, giving you instant visibility and better control during your design workflow. This improve...

Step into the world of Composite Typography Tokens and discover a smarter way to manage text styles in Penpot. In this video, Juan, Product Designer, introduces composite typography tokens that bundle font, weight, size, line height, spacing, and ...

This release is all about removing friction and giving you a smoother, more connected workflow: Color tokens appear now on the properties menu, Variants have an intuitive boolean toggle, PDF export becomes easier to select, Single sign-o...