Featured
Resize your boards or shapes to any aspect ratio quickly without doing the math. Resize frames by selecting a aspect ratio.
119 results
Featured
Featured
Export your color styles and generate a JSON file in Penpot Design Tokens standard format. This file gives you a solid starting point for your color system - no need to recreate everything manually.
Featured
Say goodbye to lorem ipsum — ContentMock simplifies your Penpot workflow by replacing design elements with realistic placeholder data. Quickly mock up names, numbers, and custom fields to create convincing prototypes without hassle.
Featured
Select two filled shapes in your design to quickly calculate and check the color contrast between them, helping ensure accessibility and readability.
Featured
A full-featured design token manager plugin for Penpot. Create, organize, and maintain your design tokens directly inside Penpot without leaving the workspace.
Featured
120+ vector illustrations for your design projects. Now, you can use all illustrations completely free in your designs.
Featured
Turn your Penpot designs into clean, frontend code for React, HTML/CSS, Angular, Next.js, Gatsby, & Vue with Locofy Lightning. Powered by LocoAI, convert designs into developer-friendly code that you can easily extend. 1. Convert Penpot designs to code for React, HTML/CSS, Angular, Next.js, Gatsby, and Vue 2. Auto-generate responsive, clean, modular code with support for design systems and UI libraries 3. Powered by LocoAI, which smartly identifies components, patterns, and reuses custom elements 4. Convert entire projects or specific layers, with smart code updates for edited designs 5.Preview, fine-tune, and export live code or sync directly to GitHub and VS Code via Locofy Builder *Note: The Locofy plugin can be used for free, but credit card details are needed to access it.*
Featured
This plugin generates customizable Lorem Ipsum text for your designs. Choose between paragraphs, sentences, words, or characters.
Featured
Palette Swapper is a Penpot plugin that allows you swap a color palette defined in your colors library to another in your designs. Just select the origin palette and the target palette and watch it do its magic by changing all the colors of the original palette into the ones in the target palette for your current page!
Featured
Browse and install Penpot plugins from the community. Search, filter, and discover new tools to enhance your design workflow.
Featured
The "Replace Shapes" plugin replaces any selected shapes with a copied shape, essentially pasting the copied shape over the selection and removing the originals.
Featured
Transform chaotic files into a perfectly organized canvas with one click. The ultimate plugin for people who value a clean and organized canvas. Super Tidy automatically organizes your canvas and layers with precision. Auto-align frames to customizable spacing grids. Renaming with sequential numbering and custom naming patterns. Layer sorting that matches your visual canvas layout. Flexible layout format - organize in rows or columns. Pager numbering with custom variables for presentations Note: This plugin shows a brief ad for an upgrade to its PRO plan. You can still use the free version after the ad finishes.
New
Palette Vault generates color palettes and puts them into your file the way you need them. Everything is built in OKLCH, a color space where equal numeric steps look like equal steps to the eye. In HSL a yellow and a blue can claim the same lightness while the yellow glares and the blue reads as nearly black, so a palette built on it comes out uneven no matter how carefully the numbers were chosen. Extraction clusters in OKLab for the same reason: two greens you would read as one color can sit further apart in RGB than a green and a grey you would never confuse. The plugin makes no network requests. Images are read from your own file and processed on your machine, and nothing is recorded about what you do. It asks for four permissions and no more: content:read and content:write to see your selection and create shapes, library:read and library:write to add colors. It does not ask who you are, what anyone commented, or for a copy of your file. For designers who pick colors often and want them reusable rather than pasted. Key features and use cases: Generate a palette in OKLCH. Eight schemes, a reroll button, Space to reroll, click a swatch to copy its hex. Extract colors from an image in your selection. Pixels are clustered by how they look rather than sampled at random. Take the colors already in your selection, gradient stops included, ranked by how much of the artwork each one covers. This is also how you get the palette out of an SVG: Penpot turns vector art into shapes with fills, so there is no image to read but plenty of color. Put the palette in the file three ways: swatches on the canvas for exploring, fills applied to the shapes you already drew, or colors added to the file library under one Palette Vault heading. Library colors are named by position, never by hue, because a color called blue holding an orange after one reroll is worse than Color 2 holding anything. Check contrast. Select two shapes, or one shape on a background, and get the ratio against all five WCAG thresholds at once. A ratio of 3.2 fails body text and passes large text, and a single verdict would hide the case where the fix is the type size rather than the color.
SyncBoard is a stateless, open-source integration tool that lets product and design teams sync design screens from Penpot directly into Miro boards as lightweight, flat images. It prevents canvas clutter by updating images in-place (zero duplicates) using metadata tagged inside Miro's native title property. This plugin is a Community version and has rate limits to protect the infrastructure (Vercel, Ably, and Upstash free accounts). You can self-host for free. Find out more in the github repo or in the documentation. Documentation: https://www.syncingboard.com/ How to setup: https://youtu.be/qEVvAl1ohoE
Export hdr bitmaps, high quality print PDF's and more all with content protection with the Lolly engine
Import W3C DTCG (Design Tokens) files into a Penpot file as native token sets, in one click. Point it at any DTCG tokens JSON — for example the output of Mint's `mint-ds export --target dtcg` — and it creates the matching sets and tokens through Penpot's Design Tokens Plugins API. Re-running it syncs changes instead of duplicating: existing sets are reused and token values are updated in place.
Arc & Path bends text along curves — right on the canvas, staying fully editable. Pick a text layer and bend it into a circular arc with a single angle slider, or select a text layer together with a path and the text flows along that path, each character rotated to follow the curve. Unlike outlining text to a shape, every character stays real, editable text (font, color and content remain live). Everything is non-destructive and re-adjustable: the generated group remembers its text, font and all parameters, and the original text layer is kept as the editable source — reselect the group anytime to tweak the angle, spacing, size or offsets. Great for logos, badges, seals, posters, packaging and any headline that needs to follow a shape.
Turn your Penpot designs into clean, frontend code and styling for React, HTML/CSS, Angular, Tailwind CSS, SCSS, Next.js, Gatsby, & Vue. 1. Convert Penpot designs to code for React, HTML/CSS, Angular, Next.js, Gatsby, and Vue 2. Auto-generate responsive, clean, which smartly identifies components, patterns, and reuses custom elements 3. Convert entire projects or specific layers , with smart code updates for edited designs
Export your Penpot tokens to 9 languages and deploy them to Git. No intermediate JSON file or extra transformation tool required. FEATURES Free - 5 exports per month (all languages and color formats included, resets monthly) - Analyze your tokens: view all Penpot token sets - Check your tokens: detect broken aliases, type mismatches, naming issues, and duplicate values before export - Instant generation: preview and export to all supported languages and color formats - Copy with one click: copy generated code to your clipboard - Live sync: always up to date with your latest Penpot tokens Pro (Free trial available) Everything in Free, plus: - Unlimited exports: no monthly cap - Bulk export: download all token sets as a single ZIP file - Detailed issue preview: expand each check category to see exactly which tokens are affected, with names, messages, and collection context - Git deployment: push files directly to GitHub, GitLab, Azure DevOps, Bitbucket, or self-hosted GitLab - Multiple token sets in a single commit - Custom prefix: add a prefix to all exported token names (e.g., "my-app--color-primary") - Reference control: preserve token references or resolve them to raw values - Auto pre-filled commit messages, editable before pushing - Customizable branch and target directory GIT INTEGRATION & SECURITY Generated code becomes your version-controlled source of truth, replacing the traditional multi-step pipeline. Easily manage your Git providers: - Add a new provider - Edit the settings of an existing provider - Delete a provider if it's no longer needed When saving a Git provider, the following fields are available: "token", "owner", "repository", "branch", "basePath" and "host" (for self-hosted GitLab). Your Git provider details are stored locally on your machine for privacy and security. FILE STRUCTURE - A separate file is generated for each token set - Files follow the naming pattern: "{tokenSetName}.{extension}" (e.g., "colors.css", "spacing.ts") TOKEN TRANSFORMATIONS Penpot tokens are transformed to ensure they are valid for each target language: - Slashes ("/"), dots ("."), and spaces are replaced with hyphens ("-") in token names - Original casing of token names is preserved (uppercase, lowercase, etc.) - For numeric tokens ("FLOAT" type), the unit "px" is automatically added - Tokens are sorted alphabetically UI & ACCESSIBILITY - Dark mode compatible: adapts to Penpot theme preference - Keyboard navigation: all interactive elements support keyboard use - Focus indicators: clear visual focus on form fields and interactive elements - Accessibility compliance: designed following W3C and A11Y best practices HOW TO USE 1. Export: Go to the Export tab and pick a language (CSS, SCSS, Tailwind v4, TypeScript, DTCG, Penpot JSON, SwiftUI, Jetpack Compose, or Flutter). Select a token set, then copy or download your tokens. 2. Check (Free): Go to the Check tab to validate your tokens. Issue counts are shown for all users; upgrade to Pro for a full detailed breakdown. 3. Deploy (Pro): Add a Git provider in Settings, then go to Deploy to push your files to GitHub, GitLab, Azure DevOps, or Bitbucket with a single click. QUESTIONS & SUPPORT Have a question or found a bug? Reach out on GitHub Discussions https://github.com/figma-css-variables/community/discussions Report an issue https://github.com/figma-css-variables/community/issues
A Penpot plugin that turns the selected bitmap image (a PNG/JPG inside an Image shape, or any shape with an image fill) into editable SVG paths and inserts them back into the canvas.
A Penpot plugin that turns the current selection (boards, groups, or shapes) into an animated GIF. Each selected item becomes one animation frame.
Select any image in Penpot, brush over what you want gone, and watch it disappear. What it can erase? Watermarks, logos, people, objects, text, clutter - anything you don't want removed from your photo. Why designers use this: - Clean up product photos without leaving Penpot - Remove unwanted objects from mockups - Touch up images in your workflow Adjustable brush size. Works on any image. Free to use. Built with advanced AI inpainting - same tech used by professional photo editors, now in your Penpot workflow.
Bring your color palettes from ColorSlurp into Penpot in seconds. Export your palette as JSON in ColorSlurp, paste or drop it into the plugin, pick the colors you want — and import them directly into your local color library.
Build a solid design system foundation in seconds instead of spending hours or days setting one up from scratch. Start by selecting a base foundation. from there, you can either deploy it instantly or take a moment to tweak it. adjust colors, typography, spacing, tokens, whatever you need before pushing it live. The idea is speed without losing control. Quick if you want it, precise if you need it.You can export your tokens to json or css so they’re ready for development, not just sitting in design files. If you want to clean things up, you can delete themes or token sets directly from the plugin without digging around. Simple start, flexible system, no unnecessary friction.
Generate design.md skill files for AI tools using a local configurator for Penpot and set up colors, typography, spacing, branding, and other style guidelines for the skill manifest. Designers and developers should share a common skill file between projects so that whenever AI is being used to develop either code or design it will reference the design md file. The skill file manifest itself is based on the official TypeUI configuration which is open-source.
Professional mockup generator with 5000+ device and print mockup scenes. Select a frame in Penpot, choose a scene, and export a ready-to-use mockup without leaving the canvas. Browse the full mockup library inside the plugin. Phones, laptops, tablets, monitors, posters, books, packaging, and more. Adjust backgrounds, reposition your artwork, crop. The kind of tweaks that used to mean opening a separate tool. Free mockup collection included. Preview everything, export from the free set at no cost. Premium gives you the full library, unlimited exports, and a commercial license for client work, case studies, and marketing. Monthly or annual subscription, cancel anytime.
Penpot AVA is an AI-powered design assistant that lets you control the Penpot canvas through natural language. Connect any OpenAI-compatible API (OpenAI, local models via Ollama, etc.), then just describe what you want - AVA reads the canvas, plans the changes, and executes them directly. No copy-pasting code, no manual shape hunting. Designers who want to move fast, explore ideas quickly, or automate repetitive layout work will feel right at home.
IconFlow is a seamless icon library plugin designed specifically for Penpot. It streamlines your design workflow by allowing you to search, browse, and insert high-quality SVG icons directly into your Penpot projects without ever leaving the workspace. Whether you're building a quick wireframe, a complex user interface, or a full design system, IconFlow gives you instant access to the essential icons you need, boosting your productivity and keeping you in the creative zone.
It convert a coded prototype or landing page into a Penpot design file for iteration - Import HTML email templates into Penpot for visual editing - Turn Tailwind CSS component libraries into reusable Penpot design assets - Bring an existing website section into Penpot to redesign or annotate it - Convert AI-generated HTML (from ChatGPT, Claude, v0) directly into editable design layers - Bridge the gap between developers and designers by going from code back to design - Quickly mock up design variations starting from a working HTML reference.
