MCP Design System Extractor

http

Extracts component information, including HTML, styles, and metadata, from Storybook design systems.

Install

npx mcp-design-system-extractor@latest

extract_design_tokens Extracts design tokens (colors, typography, spacing, etc.) from a design system
extract_components Extracts component definitions and metadata from a design system
extract_patterns Extracts usage patterns and composition rules from a design system
extract_icons Extracts icon library information from a design system
extract_animations Extracts animation and transition definitions from a design system
extract_breakpoints Extracts responsive breakpoint definitions from a design system
extract_accessibility Extracts accessibility guidelines and requirements from a design system
extract_documentation Extracts documentation and usage guidelines from a design system
extract_theme Extracts theme configuration and variant definitions from a design system

★ 65 GitHub stars