awesome-repositories.comBlog
© 2026 Bringes Technology SRL·VAT RO45896025·hello@bringes.io
MCPBlogSitemapPrivacyTerms
Penpot | Awesome Repository
← All repositories

penpot/penpot

0
View on GitHub↗
44,336 stars·2,508 forks·Clojure·mpl-2.0·1 viewpenpot.app↗

Penpot

AI search

Explore more awesome repositories

Describe what you need in plain English — the AI ranks thousands of curated open-source projects by relevance.

Let's find more awesome repositories

Features

  • Collaborative Design Platforms - Building user interfaces and prototypes in a shared workspace where multiple team members can design and provide feedback simultaneously.
  • Component Libraries - The platform allows users to create reusable components to speed up the design workflow and ensure consistent user interface elements throughout a project.
  • Design Component Systems - Manages reusable design elements by linking instances to a master source to propagate property updates and style changes automatically.
  • Design Handoff Tools - A specialized interface for inspecting design properties, measuring layouts, and generating code snippets to bridge the gap between design and implementation.
  • Component Variant Management - The platform allows users to switch between component variants in designs while preserving layer overrides based on shared names, types, and hierarchy levels.
  • Design Component Managers - The platform provides tools to create, duplicate, delete, and restore main components to manage reusable design elements across files and asset libraries.
  • Design System Synchronization Tools - The platform enables users to publish and connect shared design libraries across team files to reuse assets, synchronize updates, and maintain consistency throughout projects.
  • Design Token Management - The platform enables users to organize tokens into distinct sets to manage collections, enable specific groups, and override values using a cascading order.
  • Flexbox Layout Engines - The platform enables users to align and distribute elements within containers automatically using standard layout properties to create flexible and responsive designs.
  • Grid Layout Engines - The platform allows users to organize elements into two-dimensional rows and columns with control over alignment, spacing, and responsiveness using standard grid properties.
  • Vector Design Editors - A canvas-based tool for manipulating design layers, applying visual styles, and constructing responsive layouts using flexible grid and alignment properties.
  • Vector Graphics Rendering - Renders design elements directly into the browser using scalable vector graphics to ensure high-fidelity visual representation and precise manipulation.
  • Animation Libraries - The platform allows users to apply smooth visual movements like dissolves or slides between screens by adjusting duration and easing settings to create a polished experience.
  • Component Override Systems - The platform enables users to modify specific properties of component copies while maintaining inheritance or reset these changes to revert to the original state.
  • Design Inspection Environments - The platform provides a view-only inspection mode within the workspace to safely examine design properties and layout details without modifying the original project files.
  • Design Synchronization Engines - The platform enables users to push property changes from a modified component copy back to its main component to update all other instances automatically.
  • Design System Management - Centralizing visual styles and reusable components to ensure consistency and efficiency across large-scale product design and development projects.
  • Design Token Engines - The platform allows users to apply mathematical operators to numerical token values to build flexible design systems with dynamic relationships between different properties.
  • Design Token Synchronization - The platform enables users to synchronize visual properties like colors and spacing across all designs to maintain a unified look and feel.
  • Design Token Systems - Applies design properties through a hierarchical structure of variables that allow for dynamic theme switching and global style management.
  • Interactive Prototyping Engines - Executes interactive transitions and state changes by mapping user triggers to navigation paths within a defined flow graph.
  • Layer Selection Tools - The platform allows users to select specific layers or nested elements using click-and-drag, multi-select modifiers, or deep-selection shortcuts to bypass group boundaries.
  • Prototyping Environments - A visual environment for linking design screens and defining user interactions to simulate product behavior and test navigation flows.
  • Prototyping Workflows - The platform allows users to connect individual design screens by drawing paths between them to establish the sequence of user journeys that can be previewed and tested.
  • Developer Handoff Utilities - The platform enables users to generate ready-to-use code snippets for markup and styling by selecting specific layers and switching to the code tab within the interface.
  • Component Variant Sets - The platform enables users to combine multiple related components into a single unit to manage different states or variations efficiently within a design system.
  • Design Specification Viewers - The platform enables users to display detailed information regarding the style, typography, and content of selected layers through a dedicated information panel for precise implementation.
  • Design System Managers - A centralized environment for defining, organizing, and synchronizing reusable design tokens, components, and shared asset libraries across projects.
  • Design Token Managers - The platform allows users to define reusable and semantic design tokens by assigning a unique name, a specific value, and a description within the system panel.
  • Design Token Theming - The platform enables users to apply different token sets dynamically based on context like brand or platform by grouping and activating specific theme combinations.
  • Layout Engines - Calculates element positioning and responsiveness using standard web layout algorithms to mirror browser-native rendering behavior in the design environment.
  • Visual Styling Utilities - The platform enables users to apply visual styles including border radius, shadows, and opacity to layers, or transfer these properties between elements using copy-paste shortcuts.
  • Conflict Resolution Systems - Synchronizes concurrent user edits across multiple clients by resolving conflicts through a centralized server-side sequence of operations.
  • Component Swapping Utilities - The platform allows users to substitute one component copy with another from the assets library to iterate on designs while maintaining the existing structure.
  • Layout Positioning Utilities - The platform allows users to fix specific UI components like headers or navigation bars to the screen so they remain visible while content scrolls underneath them.
  • User Journey Management - The platform enables users to group related screens into independent paths with unique starting points to help manage and share distinct user journeys within a project.
  • Collaborative Feedback Tools - The platform enables users to exchange contextual feedback directly on design elements to facilitate communication and improve collaboration between team members during the design process.
  • Plugin Architectures - Allows third-party code to interact with the design workspace through a sandboxed interface to add custom tools and functionality.
  • Plugin Managers - The platform enables users to install and organize custom plugins to extend your design workspace functionality by adding tools directly from a central hub.
  • Authentication Management - The platform provides tools to manage personal account settings and generate access tokens to authenticate and interact with the workspace securely.
  • Component Organization Tools - The platform allows users to organize components into logical groups within the assets library using naming conventions, drag-and-drop actions, or menu commands.
  • Design Asset Export Tools - The platform allows users to export design assets using predefined presets directly from the inspection panel to prepare visual elements for implementation in your codebase.
  • Design Asset Navigators - The platform provides search tools to navigate between the design viewport and the assets panel to find and select main components quickly.
  • Design Asset Repositories - The platform allows users to save visual elements and styles in a central repository to reuse them easily across multiple design projects and files.
  • Design Management Systems - The platform enables users to organize designs using high-level containers that support screen-specific layouts, prototyping, and direct linking for team collaboration.
  • Design Token Aliasing - The platform allows users to link tokens to existing values using curly braces to create dynamic relationships that update automatically when the source token changes.
  • Developer Design Handoff - Bridging the gap between designers and developers by providing tools to inspect layouts, measure elements, and generate production-ready code snippets.
  • Interaction Triggers - The platform enables users to initiate transitions between different screens or states by assigning specific triggers like mouse clicks, hover movements, or automatic time delays.
  • Navigation Actions - The platform enables users to control how users move through your prototype by setting specific actions like opening new screens, toggling overlays, or launching external websites.

    • This project is a browser-based collaborative design platform that provides a comprehensive workspace for interface design, interactive prototyping, and design system management. It functions as a vector graphics editor that enables teams to create, manage, and iterate on designs in real-time, utilizing a component-based inheritance model to ensure consistency across complex projects.

    The platform distinguishes itself through a deep integration of design and development workflows. It features a specialized developer handoff workspace that allows for the inspection of design properties, precise layout measurement, and the generation of production-ready code snippets. The system is built on a high-fidelity canvas engine that uses scalable vector graphics and standard web-native layout algorithms, such as flexbox and grid, to ensure that designs mirror browser-based rendering behavior.

    Beyond core editing, the platform provides robust infrastructure for managing design systems at scale. This includes a hierarchical token-based cascading system for global style management, shared library management for cross-project asset synchronization, and an event-driven engine for building interactive prototypes. Users can further extend the workspace through a plugin-based architecture and configure webhooks to integrate design events with external systems.