Penpot: The Open-Source Design Platform — Figma Alternative for Teams

What Is Penpot?

Penpot is an open-source design and prototyping platform. Real-time collaboration, SVG-native output, CSS-ready inspect mode — everything Figma offers, but self-hosted. 35K+ GitHub stars. Backed by Kaleidos.

Penpot vs Figma

Why SVG-Native Matters

Penpot uses SVG as the native format. This means:

• Export any design element as clean, standards-compliant SVG
• CSS values in inspect mode are real — not approximations
• No translation layer between design and code
• Designs are accessible by default (SVG supports alt text)

Self-Host with Docker

version: "3.9"
services:
  penpot-frontend:
    image: penpotapp/frontend:latest
    ports:
      - "9001:80"
    volumes:
      - penpot_assets:/opt/data/assets
    depends_on:
      - penpot-backend

  penpot-backend:
    image: penpotapp/backend:latest
    volumes:
      - penpot_assets:/opt/data/assets
    environment:
      - PENPOT_FLAGS=enable-registration enable-login-with-password
      - PENPOT_DATABASE_URI=postgresql://db/penpot
      - PENPOT_DATABASE_USERNAME=penpot
      - PENPOT_DATABASE_PASSWORD=penpot
      - PENPOT_REDIS_URI=redis://redis/0
      - PENPOT_ASSETS_STORAGE_BACKEND=assets-fs
      - PENPOT_STORAGE_ASSETS_FS_DIRECTORY=/opt/data/assets
      - PENPOT_TELEMETRY_ENABLED=false
    depends_on:
      - db
      - redis

  penpot-exporter:
    image: penpotapp/exporter:latest
    environment:
      - PENPOT_PUBLIC_URI=http://penpot-frontend

  db:
    image: postgres:16-alpine
    environment:
      - POSTGRES_USER=penpot
      - POSTGRES_PASSWORD=penpot
      - POSTGRES_DB=penpot

  redis:
    image: redis:7-alpine

volumes:
  penpot_assets:

Key Features

Design System Components

• Reusable components with overrides
• Shared libraries across projects
• Auto-layout (flexbox-based)
• Design tokens (colors, typography, spacing)

Developer Handoff

• Inspect mode with real CSS values
• Copy CSS directly from any element
• SVG export (no conversion needed)
• Measurements and spacing guides

Prototyping

• Interactive flows between frames
• Click, hover, and navigation interactions
• Shared prototype links (no login required)
• Comments on designs

Who Is Using Penpot?

• Government agencies — data sovereignty requirements
• Universities — free for students, self-hosted
• Open-source projects — design with open tools
• Agencies in EU — GDPR compliance without US data transfer
• Teams that outgrew Figma free — unlimited editors, self-hosted

Limitations (Honest Assessment)

• Smaller plugin ecosystem — Figma has thousands, Penpot has dozens
• Performance at scale — large files (1000+ elements) can lag
• Community size — fewer tutorials, templates, resources
• Advanced prototyping — Figma’s smart animate is more polished

But: Penpot is improving fast, and for 90% of design work, it’s more than capable.

Cost for Teams

Server cost for Penpot: ~$20/month on a small VPS handles 50+ concurrent users.

Related Articles

• AppFlowy: Open-Source Notion Alternative
• Coolify: Self-Hosted PaaS
• Plausible: Privacy-First Analytics