128 results
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.
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. *
This plugin generates customizable Lorem Ipsum text for your designs. Choose between paragraphs, sentences, words, or characters.
Browse and install Penpot plugins from the community. Search, filter, and discover new tools to enhance your design workflow.
The plugin turns a text description in to Penpot shapes. It currently supports a fine-tuned OpenAI model and anyone who wants to quickly start a project
Audit a Penpot document against its active token sets, then apply the fix. Token Lint returns a coverage rate, groups every deviation by value instead of layer by layer, and applies the right token in a single undoable action. Audit what escapes your tokens - Pick a scope: selection, page, or document - Check color, spacing, radius, typography, dimension, opacity, and rotation - Read a coverage rate and a priority list of deviations, ordered by how cheap the fix is Fix in bulk, safely - Apply every exact match in scope at once, announced with its exact count and undoable with a single editor undo - Review near matches one by one, with the residual difference shown - Select the affected layers on canvas before anything is written, and see what was skipped and why Create the tokens you are missing - Turn an orphan value, or a near match you refuse to snap, into a real token without leaving the report - Pick one of your active sets, then keep or edit the proposed name (color.3b82f6, spacing.12) - The new token is applied to its whole group right away
Put the real questions your website visitors ask on the Penpot canvas. Asyntai is an AI chatbot that answers visitors on your website. This plugin reads those chats and places every question in your Penpot file as a card. The same question from many visitors becomes one card with its count, so the biggest topics stand out at once, and the most asked question comes first. Design teams, content writers and support leads use it to design a FAQ page with real questions, to plan a help centre, or to start a workshop with what customers really ask. Requires log in Asyntai
Manage ruler guides in Penpot: copy them between boards and pages, apply composition presets, manage board grids, and move guide setups between files via JSON.
Lingolense translates your Penpot designs into 40+ languages — in one click. Select text, pick a language, hit Translate. Lingolense handles real DeepL translation, right-to-left layout mirroring, brand-term protection, and overflow warnings so nothing breaks. 40+ languages with regional variants · True RTL layout mirroring (Arabic/Hebrew) — your original stays untouched · Glossary & brand-term enforcement · Overflow detection · Context-aware AI (Pro) · Pseudo-localization · Developer handoff (CSV/JSON/XLIFF). Free plan included — no credit card required.
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.
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. Built with advanced AI inpainting - same tech used by professional photo editors, now in your Penpot workflow. Limited free usage






























