Skill 与 AgentSKILLS & AGENTS· CLAUDE-SKILL
arvindrk/extract-design-system
从任意网站提取设计规范，生成可复用的颜色、间距等代码文件。Extract colors, typography, spacing, and shadows from any public website and turn them into CSS and JSON files for your project.
根据公开文档整理，未运行实测；费用以项目官网为准。Based on public documentation, without runtime testing. Check the project site for pricing.
能力CAPABILITIES
从任意公开网站抓取颜色、字体、间距等设计数值
自动生成可直接使用的CSS变量和JSON文件
把网站的设计风格整理成项目可用的初始文件
Extract colors, typography, spacing, and shadows from any public website
Generate CSS custom properties for your project
Save design tokens as JSON files
Use with Claude, Cursor, and Codex
上手GET STARTED
npx skills add arvindrk/extract-design-system选择与你的环境对应的方式。命令来自项目文档，未运行实测。Choose the option for your environment. Commands come from project documentation and have not been run-tested.
使用限制LIMITATIONS
以下要求与风险来自文档静态检查，未执行项目代码；扫描没有命中，不代表使用安全。Risk here is evidence, not an alarm. These findings come from static scanning of the docs; we never execute a project’s code.
限制LIMITS
需检查Needs review
项目动态PROJECT ACTIVITY
首次发现FIRST SEEN
03 OCT 202603 OCT 2026
增长GROWTH
+6.5%+6.5%
231 → 246 stars · 16 个快照231 → 246 stars · 16 snapshots
状态STATUS
持续活跃Active
已有246个star和36个fork，社区关注度不错，说明很多人觉得有用。Extracts design tokens from any public website
静态扫描STATIC SCAN
01控制浏览器Controls a browserreadme
npx playwright install chromium
02控制浏览器Controls a browserskills/extract-design-system/SKILL.md
npx playwright install chromium
扫描发现该项目使用 Playwright 控制浏览器（中等风险），建议在隔离环境中运行，避免访问敏感网站。The static scan found a medium risk: this tool uses Playwright to control a Chromium browser. Review the code before running it.
依赖：Dependencies:@modelcontextprotocol/sdk, commander, dembrandt, execa, zod
{
"agents": [
{
"agent": "cursor",
"evidence": "tree: .cursor/"
},
{
"agent": "claude-desktop",
"evidence": "readme: …ctured tool calls for Cursor, Claude Desktop, and any MCP-compatible agent…"
}
],
"apiKey": null,
"docker": null,
"taxonomy": {
"scores": {
"design": 12,
"ai-tools": 3,
"dev-tools": 6,
"indie-web": 1,
"skill-agent": 12,
"productivity": 3
},
"primary": "skill-agent",
"secondary": "claude-skill"
},
"localRuntime": null,
"skillMdTotal": 1,
"skillMdErrors": [],
"treeTruncated": false,
"categoryScores": {
"data": 0,
"agent": 0,
"media": 0,
"design": 24,
"browser": 3,
"devtool": 3,
"security": 0,
"marketing": 0,
"productivity": 0
},
"classification": [
{
"signal": "1 SKILL.md with name + description",
"weight": 0.95
},
{
"signal": "package.json depends on @modelcontextprotocol/sdk + MCP framing",
"weight": 0.8
},
{
"signal": "skills/ directory with 3 markdown files",
"weight": 0.75
},
{
"signal": "README describes a Claude / Agent Skill",
"weight": 0.7
},
{
"signal": "README ships an mcpServers config for this server",
"weight": 0.7
},
{
"signal": "MCP topic + README",
"weight": 0.6
},
{
"signal": "description mentions AI",
"weight": 0.2
}
],
"scannedSources": [
"readme",
"skills/extract-design-system/SKILL.md"
],
"skillMdFetched": 1
}每周一周刊Monday weekly digest