Synaptic SkillsSynapticSkills
MarketplaceSkill GraphCriar SkillMCP ServerPlataformaEnterprise
v0.1.0-beta
Voltar ao Marketplace
DevelopmentMédio

Extract Design System

porarvindrk·arvindrk· v1.0.0 · atualizado em 2026-04-10
82
Score

Extract design primitives from a public website and generate starter token files for your project.

design-systemtoken-extractioncss-generationfrontend-developmentui-designdesign-automation
0Stars
0Forks
0Usos
Fork

Documento do Skill

SKILL.mdextract-design-system/workflow
1. Confirm the target website URL is public and reachable.
2. Execute `npx playwright install chromium` to ensure Playwright is installed.
3. Run `npx extract-design-system <url>` to extract the design system.
4. Review `.extract-design-system/normalized.json` to understand the extracted design primitives.
5. If needed, use `npx extract-design-system <url> --extract-only` for extraction only.
6. If needed, use `npx extract-design-system init` to regenerate starter token files.
7. Explain the generated outputs and their purpose to the user.
8. Ask for confirmation before modifying any existing project files.

Telemetria de Agentes

Execuções
0
total
Taxa de Sucesso
0%
últimos 30d
Latência Média
0.0s
p50
Alucinação
0.0%
detecção
Tokens Entrada
0
avg 0/exec
Tokens Saída
0
avg 0/exec

Uso por Plataforma

Skills Relacionados

Depende deExtract Design System
100%
Hebbian Synapse
Composite1.000
w = 0.3·α + 0.5·β + 0.2·γ
82
Similar aVercel React Best Practices
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar aWeb Interface Guidelines
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
81
Similar afrontend-design
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
85
Similar aBrainstorming Ideas Into Designs
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
82
Similar ashadcn/ui
40%
Hebbian Synapse
Composite0.400
w = 0.3·α + 0.5·β + 0.2·γ
80
Similar aFun Brainstorming
60%
Hebbian Synapse
Composite0.600
w = 0.3·α + 0.5·β + 0.2·γ
79

Árvore do Skill

Extract Design System
extract-design-system
Fases Cognitivas6
1.SENSE
2.CONTEXTUALIZE
3.ACT
4.EVALUATE
5.RECOMMEND
6.REFLECT
Triggers7
extract design system from a websitegenerate design tokens from a URLreverse engineer a website's designcreate starter token files from a websiteextract colors and fonts from a websitegenerate tokens.json and tokens.cssinitialize design system from a public website

Avaliar este Skill

Score Breakdown

⭐Avaliação Humana0%
🤖Sucesso de Agentes0%
🕐Atualidade100%
🔗Saúde de Dependências100%
🕸️Centralidade no Grafo0%
🛡️Segurança50%
CompositeScore = α·Humano + β·Agente + γ·Recência + δ·Deps + ε·Centralidade + ζ·Segurança

Instalação

$ synaptic mcp download extract-design-system
$ synaptic skills detail extract-design-system
$ synaptic skills live extract-design-system

Dependências

npxplaywrightextract-design-system

Links

GitHub Repository