designlang
A CLI and MCP server that points a headless browser at a live website and extracts its design system as design tokens and framework-ready files.
designlang drives a headless browser to read the design system directly off a live website's rendered DOM. A single command emits design tokens in the DTCG format along with a Tailwind configuration, a shadcn theme, Figma variables, motion tokens, and typed component descriptions.
Beyond basic token extraction, it analyzes layout patterns, responsive behavior across breakpoints, interactive states such as hover and focus, and contrast against WCAG guidelines, and can crawl a whole site to synthesize one deduplicated design system from multiple pages.
It runs as a command-line tool and also exposes an MCP server for use from Claude Code, Cursor, and Windsurf, and ships a Chrome extension. It requires Node.js 20 or later and is MIT licensed.