mcpField
D
design-system-management

design-system-management

github.com/anthropicsDesign & UI33.6k118 installsUpdated 1d ago
Repository

About design-system-management

A skill for building, maintaining, and evolving design systems. It covers tokens, reusable components, and UI patterns, with principles for consistency, composability, documentation, and versioned migration.

Key features

  1. 01Catalogs tokens for color, typography, spacing, borders, shadows, and motion
  2. 02Defines component variants, states, sizes, behavior, and accessibility
  3. 03Covers common form, navigation, data, and feedback patterns
  4. 04Emphasizes consistency and composable constraints
  5. 05Documents versioning and migration paths for breaking changes

Use cases

  1. 01Organize a design system's visual tokens
  2. 02Specify reusable component states and variants
  3. 03Document shared UI patterns across a product
  4. 04Plan migrations for breaking system changes

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/anthropics/knowledge-work-plugins --skill design-system-management

After installing, type/design-system-managementin Claude Code to confirm it loaded.

Details

From the project README

Design System Management

Help build, maintain, and evolve design systems.

Components of a Design System

Design Tokens

Atomic values that define the visual language:

  • Colors (brand, semantic, neutral)
  • Typography (scale, weights, line heights)
  • Spacing (scale, component padding)
  • Borders (radius, width)
  • Shadows (elevation levels)
  • Motion (durations, easings)
Components

Reusable UI elements with defined:

  • Variants (primary, secondary, ghost)
  • States (default, hover, active, disabled, loading, error)
  • Sizes (sm, md, lg)
  • Behavior (interactions, animations)
  • Accessibility (ARIA, keyboard)
Patterns

Common UI solutions combining components:

  • Forms (input groups, validation, submission)
  • Navigation (sidebar, tabs, breadcrumbs)
  • Data display (tables, cards, lists)
  • Feedback (toasts, modals, inline messages)

Principles

  1. Consistency over creativity — The system exists so teams don't reinvent the wheel
  2. Flexibility within constraints — Components should be composable, not rigid
  3. Document everything — If it's not documented, it doesn't exist
  4. Version and migrate — Breaking changes need migration paths

Comments

Markdown supported