The design-extract repository (Manavarya09/design-extract) focuses on: Extract any website's complete design system with one command. DTCG tokens, semantic+primitive+composite, MCP server for Claude Code/Cursor/Windsurf, multi-platform emitters (iOS SwiftUI, Android Compose, Flutter, WordPress), Tailwind v4, Figma variables, shadcn/ui, CSS health audit, WCAG remediation, Chrome extension. MIT, Playwright, Node 20+.. It belongs in this directory only insofar as it supports MCP and tool-calling integration, developer-centric engineering workflows in AI products, agent systems, or developer tooling.
License
MIT
Stars
3,307
Homepage
https://www.designlang.app/Features
- Maintainer description for design-extract: Extract any website's complete design system with one command. DTCG tokens, semantic+primitive+composite, MCP server for Claude Code/Cursor/Windsurf, multi-platform emitters (iOS SwiftUI, Android Compose, Flutter, WordPress), Tailwind v4, Figma variables, shadcn/ui, CSS health audit, WCAG remediation, Chrome extension. MIT, Playwright, Node 20+.
- design-extract uses JavaScript as its recorded primary language, which helps with stack-fit review.
- design-extract provides material for evaluating video, animation, avatar, or media-generation pipelines.
- design-extract shows how external tools or MCP-style capabilities may connect around the project.
- design-extract fits engineering teams assessing code, CLI, SDK, runtime, or developer-tooling workflows.
- design-extract lists MIT license metadata; review obligations before redistribution or hosted use.
Use Cases
- Use design-extract when the need is video and media processing and the repo summary matches: Extract any website's complete design system with one command. DTCG tokens, semantic+pr...
- Compare the JavaScript implementation in design-extract before choosing a similar internal architecture.
- Use design-extract to prototype media production flows against an open implementation.
- Use design-extract to connect tool-enabled agent workflows to the repository capability.
- Use design-extract to study developer-tooling implementation details before building internal workflows.
- Complete a MIT license review before packaging design-extract into a commercial or hosted workflow.
FAQ
Start from the repository summary (Extract any website's complete design system with one command. DTCG tokens, semantic+primitive+composite, MCP server for Claude Code/Cursor/Windsurf, multi-platform emitters (iOS SwiftUI, Android Compose, Flutter, WordPress), Tailwind v4, Figma variables, shadcn/ui, CSS health audit, WCAG remediation, Chrome extension. MIT, Playwright, Node 20+.), then verify maintenance status, integration boundaries, and whether its video and media processing, MCP and tool-calling integration, developer engineering workflows focus matches the intended workflow. Repository: https://github.com/Manavarya09/design-extract. Stars: about 2,262. License: MIT. Language: JavaScript.
design-extract is best treated as a repository-level component or reference implementation for video and media processing, MCP and tool-calling integration, developer engineering workflows. Good evaluation scenarios include: Use design-extract when the need is video and media processing and the repo summary matches: Extract any website's complete design system with one command. DTCG tokens, semantic+pr... Compare the JavaScript implementation in design-extract before choosing a similar internal architecture. Use design-extract to prototype media production flows against an open implementation.
