Manage and infer token systems for Penpot design foundations.
npx skills add https://github.com/penpot/penpot-ai-kit --skill penpot-foundations
Please help me install this Agent Skill. Skill: penpot-foundations Source: https://github.com/penpot/penpot-ai-kit/tree/main/skills/penpot-foundations Command: npx skills add https://github.com/penpot/penpot-ai-kit --skill penpot-foundations
This Skill provides a foundation for building and governing the token + library foundation of a Penpot design system. It helps manage primitive, semantic, and component token tiers, themes (light/dark), and inferring a token system from an existing hardcoded design.
To get started, execute the penpot-foundations Skill and follow the workflow outlined in the documentation.
High-intent search queries and answers about installing and using this skill.
You can transition a hardcoded Penpot design to a token-based system by using the inference feature to automatically infer and organize primitive, semantic, and component tokens from existing design values. This automates extracting hardcoded styling and mapping it to structured token tiers.
Managing primitive, semantic, and component tiers in a design system involves creating and organizing tokens across these three distinct levels. This Skill provides the framework to structure these tiers systematically, ensuring scalable token architecture governance within Penpot.
Yes, you can build and maintain light and dark mode themes using Penpot tokens. The Skill supports theme development by mapping semantic and component tokens to different theme contexts, allowing consistent UI adaptation across light and dark modes.
Inferring a design system from existing hardcoded values is best handled by automatically detecting hardcoded styling properties and mapping them to primitive, semantic, and component token tiers. This establishes a structured token foundation without manual token creation.
Yes, governing a Penpot design system foundation requires shared references like the penpot-mcp-tool-reference, plugin-api-gotchas, tokens-schema, naming-conventions, and state-management to ensure proper execution and structural integrity.
When inferring tokens from hardcoded designs in Penpot, limitations may arise from complex or undocumented styling structures that do not cleanly map to primitive, semantic, and component token tiers, requiring manual adjustment to achieve a coherent token system.
hulusi-tuncEstablish naming conventions for design elements, components, and tokens.
mintuzStandardize Tailwind design systems with semantic tokens, CVA variants, and dark-mode theming.
penpotAutomate Penpot component creation with variant matrices and tokenized design systems.
klarbauStandardize three-layer design tokens and generate brand-compliant slides with HTML validation.
