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+.
Designlang is a Node 20+ CLI and MCP server that points a Playwright-driven headless browser at any live URL and extracts its complete design system into 17 or more structured output files. A single `npx designlang` command produces W3C DTCG tokens split into primitive, semantic, and composite layers, a Tailwind v4 config, shadcn/ui CSS variables, Figma Variables JSON for light and dark modes, motion tokens with easing and spring detection, typed React component anatomy stubs, brand voice metadata, and paste-ready prompts for Claude Artifacts, among others. The MCP server connects directly to Claude Code, Cursor, and Windsurf, letting those agents consume the extracted design payload at inference time. Multi-platform output covers iOS SwiftUI, Android Compose, Flutter, and WordPress block themes via the `--platforms` flag. A standout feature is the graded report card with a shareable SVG badge that developers can drop into any README. WCAG contrast scoring includes a remediation palette suggesting nearest passing color alternatives. The tool targets frontend developers, design engineers, and AI coding agents needing accurate design-system context for code generation.
- ✓Open-source license (MIT)
- ✓Actively maintained (<30d)
- ✓Healthy fork ratio
- ✓Clear description
- ✓Topics declared
- ✓Documented (README)
git clone https://github.com/Manavarya09/design-extract{
"mcpServers": {
"design-extract": {
"command": "node",
"args": ["/path/to/design-extract/dist/index.js"]
}
}
}Resumen de MCP Servers
Lo que la gente pregunta sobre design-extract
¿Qué es Manavarya09/design-extract?
+
Manavarya09/design-extract es mcp servers para el ecosistema de Claude AI. 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+. Tiene 3.2k estrellas en GitHub y se actualizó por última vez today.
¿Cómo se instala design-extract?
+
Puedes instalar design-extract clonando el repositorio (https://github.com/Manavarya09/design-extract) o siguiendo las instrucciones del README en GitHub. ClaudeWave también te ofrece bloques de instalación rápida en esta misma página.
¿Es seguro usar Manavarya09/design-extract?
+
Nuestro agente de seguridad ha analizado Manavarya09/design-extract y le ha asignado un Trust Score de 100/100 (tier: Verified). Revisa el desglose completo de comprobaciones superadas y flags en esta página.
¿Quién mantiene Manavarya09/design-extract?
+
Manavarya09/design-extract es mantenido por Manavarya09. La última actividad registrada en GitHub es de today, con 23 issues abiertos.
¿Hay alternativas a design-extract?
+
Sí. En ClaudeWave puedes explorar mcp servers similares en /categories/mcp, ordenados por popularidad o actividad reciente.
Despliega design-extract en tu cloud
Lleva este repo a producción en minutos. Cada plataforma genera su propio entorno con variables de entorno editables.
¿Mantienes este repo? Añade un badge a tu README
Pega el badge en tu README de GitHub para mostrar que está auditado por ClaudeWave. Cada badge enlaza de vuelta a esta página y muestra el Trust Score actual.
[](https://claudewave.com/repo/manavarya09-design-extract)<a href="https://claudewave.com/repo/manavarya09-design-extract"><img src="https://claudewave.com/api/badge/manavarya09-design-extract" alt="Featured on ClaudeWave: Manavarya09/design-extract" width="320" height="64" /></a>Más MCP Servers
Fair-code workflow automation platform with native AI capabilities. Combine visual building with custom code, self-host or cloud, 400+ integrations.
User-friendly AI Interface (Supports Ollama, OpenAI API, ...)
An open-source AI agent that brings the power of Gemini directly into your terminal.
The fastest path to AI-powered full stack observability, even for lean teams.
🕷️ An adaptive Web Scraping framework that handles everything from a single request to a full-scale crawl!
⭐AI-driven public opinion & trend monitor with multi-platform aggregation, RSS, and smart alerts.🎯 告别信息过载，你的 AI 舆情监控助手与热点筛选工具！聚合多平台热点 + RSS 订阅，支持关键词精准筛选。AI 智能筛选新闻 + AI 翻译 + AI 分析简报直推手机，也支持接入 MCP 架构，赋能 AI 自然语言对话分析、情感洞察与趋势预测等。支持 Docker ，数据本地/云端自持。集成微信/飞书/钉钉/Telegram/邮件/ntfy/bark/slack 等渠道智能推送。