skills.rest
Andy-HNU
Andy-HNUCOMMUNITY
Explore all skills by this author →
GitHub

design-systems

Plan and structure design systems with component libraries, tokens, and governance.

Updated Mar 9, 2026
Search Tags:#design#governance#adoption#design-tokens#design-systems#component-library
One-click install
npx skills add https://github.com/Andy-HNU/AndyClaw --skill design-systems-andy-hnu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-systems
Source: https://github.com/Andy-HNU/AndyClaw/tree/main/skills/lenny-design-systems
Command: npx skills add https://github.com/Andy-HNU/AndyClaw --skill design-systems-andy-hnu

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Design teams often struggle to create consistent interfaces across products, scale brand guidelines, and align engineering and design work. This Skill provides a structured approach to building and scaling design systems to reduce fragmentation and accelerate delivery.

Core Features & Use Cases

  • Assess needs and scope: determine whether a component library, design tokens, documentation, or governance is required.
  • Plan adoption and maintenance: establish owner roles, governance policies, and a roadmap for evolution.
  • Leverage real-world guidance: apply principles and patterns from industry leaders to ensure scalable systems.

Quick Start

Define your design-system scope and start with an MVP that covers components, tokens, and documentation.

Frequently Asked Questions about design-systems

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scale a design system for multiple products?▼

Plan adoption and maintenance by establishing owner roles, governance policies, and an evolution roadmap to scale your design system and align engineering with design work across products.

What is the best way to start building a component library and design tokens?▼

Assess your team's needs to determine whether a component library, design tokens, documentation, or governance is required, then apply principles from industry leaders to ensure scalable systems.

How do I align engineering and design work for brand consistency?▼

You can align engineering and design work by applying guided principles and curated references that drive adoption and enforce brand consistency across your product interfaces.

Do I need governance policies to maintain a design system?▼

Governance is required to plan adoption and maintenance effectively, allowing product teams to scale brand guidelines and manage component libraries without fragmentation.

When do I need design tokens for my product team?▼

Design tokens are needed when assessing project scope to determine if variables for color, spacing, and typography are required to align engineering and design work effectively.

Why does our component library fail to drive adoption across teams?▼

Adoption fails without established owner roles and frontmatter metadata to guide users, causing fragmentation and preventing teams from scaling brand guidelines efficiently.

Related Skills

Explore More Design & Creative Skills→
hiimtrunghiimtrung
4

ckm:brand

Define brand voice, visuals, and messaging with frontmatter-based metadata.

Community
Advanced
RefoundAIRefoundAI
1.2k

design-systems

Defines component libraries, design tokens, and governance for scalable design systems.

Official
Intermediate
sandeshbagmaresandeshbagmare

design-system-patterns

Generate design tokens and implement theme switchers for web and mobile UIs.

Community
Advanced
kaikunnnnkaikunnnn

BONO Design System

Centralize design tokens for UI consistency in Next.js applications.

Community
Intermediate