Извлечение дизайн-токенов с сайта

design

extract-design-system is a Claude Code skill that reverse-engineers design tokens — colors, typography, spacing, border radii, and shadows — from any public website and generates ready-to-use starter files for a local project. The agent runs the bundled CLI, normalizes the extracted output, and writes four files: `.extract-design-system/raw.json`, `.extract-design-system/normalized.json`, `design-system/tokens.json`, and a W3C-compatible `design-system/tokens.css` of CSS custom properties. Install it with `npx skills add arvindrk/extract-design-system`; the package also ships an MCP server (`extract-design-system-mcp`) for Cursor, Claude Desktop, and other MCP-compatible agents. It is aimed at frontend developers and design engineers who want to bootstrap a design system from an existing site — such as cloning the visual primitives of Stripe or Vercel — without manually inspecting source code.