gutomec

Extract Ds — Design skill for Claude Code

Design community

Extrai um design system agêntico de um website ao vivo (computed styles via browser real) e salva em design-systems/ /.

How to install Extract Ds

Installs to ~/.claude/commands/gutomec-agents-guru-extract-ds.md

Terminal

mkdir -p ~/.claude/commands && curl -fsSL https://raw.githubusercontent.com/gutomec/agents-guru/HEAD/.claude/commands/extract-ds.md -o ~/.claude/commands/gutomec-agents-guru-extract-ds.md

Restart Claude Code, or start a new session, for it to be picked up.

What Extract Ds does

description: Extrai um design system agêntico de um website ao vivo (computed styles via browser real) e salva em design-systems//. argument-hint: [name] allowed-tools: Bash, Read, Write, Edit, Glob, Agent

Extraia o design system de: $ARGUMENTS

Passos:

Separe a URL do name opcional. Se não houver name, derive do hostname (ex.: stripe.com → stripe). Confirme que a URL é pública.
Pré-flight: cheque command -v agent-browser. Se ausente, avise e ofereça o escape

Alternatives in Design

Dna — Place a design in the measured design space — nearest systems, per-axis percentiles, outliers 3.6k ★
Extract Skill — Reverse-engineer design systems, tokens, and components from live products or screenshots 2.8k ★
Designer Skills — Designer Skills Collection: agentic skills, commands, and plugins for design — from research to systems, UI, i 2.3k ★