Tutorial - Penpot Blog

the_image_shows_the_title_how_to_make_prompt_more_efficient

How to make your prompts more efficient

The following “token-aware” approach treats prompts like structured contracts instead of a wish-list or diary, so you get better outputs in fewer iterations (and with fewer prompt credits).

the_image_shows_three_prompt_boxes_and_the _main_one_contains_the _title_of_the_article

The designer's guide to effective AI prompting

Learn how to write structured, token‑aware AI prompts in Penpot so you get cleaner design systems, fewer hallucinations, and faster, production‑ready outputs.

Penpot

How to deploy Penpot with Docker: A Technical, Step-by-Step Guide

Step-by-step guide to deploying Penpot with Docker. Covers installation, configuration, version management, backups, HTTPS setup, and authentication for self-hosted instances.

Editing the shadow design token in Penpot. The token has a name, color, x and y offset, blur and spread

Tutorial

Tutorial: Creating and using shadow tokens

Using shadows carefully and consistently in your UI design can make it feel polished. Shadow design tokens help you implement the consistency and quickly update your shadows across your design system.

Tutorial

Using design tokens for a proportional typographic scale

A proportional typographic scale is a hierarchy for font sizes that uses a consistent mathematical ratio. Design tokens are ideal for creating these scales.

Tutorial

Tutorial: Creating and applying typography design tokens

Typography design tokens are a way to save your text styles for reuse across your projects. The typography composite token combines multiple typography-related properties in one mega token.

Open Source

How to self-host Penpot: A technical implementation guide

Once you've decided to bring Penpot into your own infrastructure, the next step is making sure your instance runs smoothly, stays secure, and scales with your team. Learn how to self-host Penpot in your infrastructure.

A screen prototype in the center of the image, on the left the tokens Ui and on the right the Assets Ui from Penpot screen

Tutorial

Penpot deep dive: Color tokens vs asset colors

Color design tokens and asset colors are both ways you can store colors in Penpot for reuse. There are some key differences that might affect which you choose to use in your project.

Design

Tutorial: Creating and using component variants in Penpot

Component variants are a way to create different variations of a component. Does your component need different sizes? Colors? Levels of elevation? Variants make it easy to define these properties, and choose between them when you’re using a component in your designs.