Dembrandt

Dembrandt is an open-source CLI tool that extracts a website's design system into structured design tokens in seconds. It uses Playwright to render pages, reads computed styles from the DOM, and outputs colors, typography, spacing, borders, shadows, and component styles. It supports W3C DTCG format, multi-page analysis, MCP integration for AI agents, and brand guide PDF generation — all from a single command.

• Design Token Extraction — Run dembrandt example.com to instantly extract colors, typography, spacing, borders, shadows, and component styles from any website.
• W3C DTCG Format — Use --dtcg to export tokens in the standardized W3C Design Tokens Community Group format, compatible with Style Dictionary and other tooling.
• Multi-Page Analysis — Use --pages N and --sitemap flags to analyze multiple pages and merge results with cross-page confidence boosting.
• MCP / AI Agent Integration — Add Dembrandt as an MCP server in Claude Code, Cursor, Windsurf, or any MCP-compatible client; 7 tools available including get_color_palette, get_typography, and get_brand_identity.
• DESIGN.md Generation — Use --design-md to produce a plain-text design system document readable by AI coding agents.
• Brand Guide PDF — Use --brand-guide to generate a printable PDF summarizing the extracted design system.
• Dark Mode & Mobile Viewports — Use --dark-mode or --mobile flags to extract tokens from dark-mode variants or mobile-sized viewports.
• Browser Choice — Supports Chromium (default) and Firefox (--browser=firefox) for bypassing bot detection on Cloudflare-protected sites.
• Local UI — Browse all saved extractions in a visual local interface with color palettes, typography specimens, spacing visualizations, and component previews.
• Color Confidence Scoring — Assigns high/medium/low confidence scores to extracted colors based on DOM context and usage frequency.