extract-designlisted

# Extract Design — Dembrandt Dembrandt runs a headless Chromium browser against any URL, walks up to thousands of DOM elements, reads computed CSS, and returns a structured design system: colors with confidence scoring, typography styles, spacing scale, border radius, borders, shadows, and interactive component styles. ## How to Run ```bash # Install once (global) npm i -g dembrandt # Basic extraction — outputs to terminal dembrandt https://stripe.com # JSON output — pipe into files or other tools dembrandt https://stripe.com --json-only > stripe-tokens.json # W3C DTCG format (design-tokens.org standard) dembrandt https://stripe.com --dtcg --save-output # Generate DESIGN.md (human + AI readable brand doc) dembrandt https://stripe.com --design-md # Multi-page crawl (follows internal links) dembrandt https://stripe.com --crawl 5 # Dark mode colors dembrandt https://stripe.com --dark-mode # Mobile viewport dembrandt https://stripe.com --mobile # Everything saved to output/ dembrandt https://stripe.com --save-output ``` ## MCP Usage (async by default) When using the Dembrandt MCP server, all extraction tools return a `job_id` immediately rather than blocking. Poll `get_job_status` until `status` is `"completed"`: ``` 1. get_design_tokens({ url: "stripe.com" }) → { job_id: "job_123_abc", status: "queued" } 2. get_job_status({ job_id: "job_123_abc" }) → { status: "running" } // poll again 3. get_job_status({ job_id: "job_123_abc" }) → { status: "completed