Dembrandt MCP server
Design tokens from any live site: colours, type, spacing, components, drift against a baseline.
3.6k stars4.5k downloads/wk
Reviews
Write oneNobody has reviewed Dembrandt yet.
If you have run it, two minutes of your experience saves the next person an afternoon.
Dembrandt tools (21, 1 write)
write = sends, deletes, buys or postsRead from the package source without running it. The installed server may list more.
cancel_jobwrite actionCancel a queued extraction job. Has no effect on jobs that are already running.
check_contrastGrade colour pairs against WCAG 2.1 contrast, at the threshold the text size earns: 18pt, or 14pt bold, is large scale and needs 3:1 where body text needs 4.5:1. Takes pairs you name, so it grades colours you are about to ship rather than only colours already on a page. Returns the ratio, the required ratio, and the AA and AAA verdicts per pair. Pure and synchronous, no browser. For pairs already
check_robotsAsk whether robots.txt allows extracting a URL, before spending a browser run on it. Returns the verdict, the rule that decided it, and the robots.txt status. A 404 or 410 means no robots.txt and everything is allowed; any other unreadable response is treated as a refusal. Cheap and synchronous: one HTTP request, no browser.
compute_driftCompare two dembrandt extractions and return a design-drift report: a 0-100 score (0 = identical), a stable/drift verdict, per-category scores, and the list of changed/added/removed tokens (colors, typography, spacing, radius, shadows). Pure and synchronous, no browser. Takes either an inline extraction or the job_id of a completed one. Use it to check whether generated or updated UI has drifted f
export_dtcgConvert a dembrandt extraction to W3C Design Tokens (DTCG) format: color, typography, spacing, radius, border, and shadow tokens with $type/$value structure and dembrandt provenance under $extensions. Pure and synchronous, no browser. Takes either an inline extraction or the job_id of a completed one. Use it to hand tokens to Style Dictionary, Figma token plugins, or any DTCG-compatible pipeline.
export_shadcnRender a shadcn/ui theme from a dembrandt extraction: the :root block and the @theme inline mapping Tailwind v4 needs. A slot is written only where the page supplied a value, and the rest are named in the file header and left at shadcn's own defaults, so no slot is filled with an invented value that reads as measured. Pure and synchronous, no browser. Takes either an inline extraction or the job_i
export_tailwindRender a Tailwind v4 @theme CSS block from a dembrandt extraction: colors, typography, spacing, radii and shadows as custom properties, observed values only, with nothing invented. Pure and synchronous, no browser. Takes either an inline extraction or the job_id of a completed one. Write the output to a project's CSS entry point so Tailwind utilities resolve to the measured brand.
generate_design_mdRender a DESIGN.md brand guide (markdown) from a dembrandt extraction: colors, typography, spacing, surfaces, and components as a human-readable design reference. Pure and synchronous, no browser. Takes either an inline extraction or the job_id of a completed one. Write the output to DESIGN.md in a project so agents and developers build UI against the extracted brand.
get_brand_identityExtract brand identity from a live website: site name, logo (source, dimensions, safe zone), all favicon variants (icon, apple-touch-icon, og:image, twitter:image with sizes and URLs), what builds the UI with versions where recoverable (JS and meta frameworks, CSS frameworks, component libraries, site builders), icon systems, and responsive breakpoints. Set pages > 1 to crawl and merge several pag
get_color_paletteExtract brand colors from a live website. Returns semantic colors (primary, secondary, accent, plus background and text promoted from the page surface and body text), full palette ranked by usage frequency and confidence (high/medium/low), CSS custom properties with their design-system names, and hover/focus state colors discovered by simulating real user interactions. Each color in hex, RGB, LCH,
get_component_stylesExtract UI component styles from a live website. Returns button variants with default, hover, active, and focus states (background, text color, padding, border radius, border, shadow, outline, opacity), input field styles (border, focus ring, padding, placeholder), link styles (color, text decoration, hover changes), and badge/tag styles. Set pages > 1 to crawl and merge several pages, which yield
get_design_tokensExtract the full design system from a live website. Launches a real browser, navigates to the site, and returns production-ready design tokens: color palette (hex, RGB, LCH, OKLCH) with semantic roles and CSS custom properties, typography scale (families, fallbacks, sizes, weights, line heights, letter spacing by context), spacing system with grid detection, border radii, border patterns, box shad
get_findingsLint a dembrandt extraction for design-system quality issues: WCAG contrast failures, inconsistency (near-duplicate colors, off-scale spacing values, radius sprawl), and duplication. Returns findings with severity (error/warn), category, and a human-readable message, plus summary counts. Pure and synchronous, no browser. Takes either an inline extraction or the job_id of a completed one. Complemen
get_job_statusPoll for the result of an async extraction job. Returns status (queued/running/completed/failed/cancelled) and the full result once completed. Call this after any extraction tool that returned a job_id.
get_motionExtract the motion system from a live website: transition and animation durations with their usage counts, easing curves, the durations and easings used per component context (button, link, nav, card, modal), named keyframe animations, and the hover patterns discovered by simulating real interaction. Also returns gradients, which travel with motion as the decorative layer. Set pages > 1 to crawl a
get_spacingExtract the spacing system from a live website: common margin and padding values sorted by frequency, pixel and rem values, and grid system detection (4px, 8px, or custom scale). Set pages > 1 to crawl and merge several pages, which yields a markedly stronger token set than a single page. Returns a job_id by default: poll it with get_job_status, and pass the same job_id to compute_drift, get_findi
get_surfacesExtract surface treatment tokens from a live website: border radii with element context (which radii are used on buttons vs cards vs inputs vs modals), border patterns (width + style + color combinations), and box shadow elevation levels. Set pages > 1 to crawl and merge several pages, which yields a markedly stronger token set than a single page. Returns a job_id by default: poll it with get_job_
get_typographyExtract typography from a live website. Returns every font family with its fallback stack, the complete type scale grouped by context (heading, body, text, button, link, caption) with pixel and rem sizes, weights, line heights, letter spacing, and text transforms. The body context marks the dominant reading-text font; text marks other body-eligible copy. Also reports font sources: Google Fonts URL
list_jobsList all extraction jobs from this session with their status (queued/running/completed/failed/cancelled), URL, and timestamps. Completed jobs are kept for one hour.
render_reportRender a self-contained HTML report (inline CSS, no external resources) from a dembrandt extraction, optionally including a drift diff. Takes either an inline extraction or the job_id of a completed one. Returns the HTML as text: write it to a .html file to open offline or attach as a CI artifact.
validate_dtcgValidate a W3C Design Tokens (DTCG) document against the 2025.10 spec: token types, colour objects and their component ranges, dimensions, references, and property-level $ref pointers. Returns valid plus the list of errors with the path each one sits at. Pure and synchronous, no browser. Use it after writing or editing a token file, including one this server produced, so a hand edit cannot quietly
Public scan report
scanner v0.1.10 · 2026-10-13 · same rubric, same numbers if you re-run it
- Code scan147 source files scanned20/25
- –Live reliabilityno gateway calls yet and no remote to proben/a
- –Tool poisoningtools not inspected (local package is not executed); not countedn/a
- Auth qualitylocal package, no credentials required12/15
- Maintenancelast push 1 days ago15/15
- Maintainer identityregistry namespace matches repository owner7/10
Findings (1)
- mediumeval / new Function used
exec.evaldist/lib/extractors/logo.js: …site — never a crash. const H = new Function(heuristicsSource + '\nreturn…
Install Dembrandt in Claude Code, Cursor or VS Code
Runs npx -y dembrandt on your machine. Read the scan report first; the gateway never runs local packages.
claude mcp add dembrandt -- npx -y dembrandt
What the publisher says
From the Dembrandt repository's README, as published. We do not edit it. Read it on GitHub
Dembrandt.
Extract any website's design system in one command. Enforce it in CI.
Logo, colors, typography, spacing, borders, shadows, motion, components. W3C design tokens in seconds.
Install
npm install -g dembrandt
dembrandt install-browser # one-time: fetches the matching Chromium
dembrandt dembrandt.comThe browser step is required. dembrandt drives Chromium through playwright-core, which ships no browser binaries, so a fresh install has nothing to launch until you run it. Skipping it fails with browser engine not available.
Or use npx without installing: npx dembrandt dembrandt.com. The browser step applies here too: run npx dembrandt install-browser first. Browsers land in a shared Playwright cache, so either route only needs it once.
Requires Node.js 18+
Or install the MCP server straight into your editor and let the agent run it:
What you get
- Colors (semantic roles with the evidence behind each pick, curated palette, every detected colour, CSS variables, gradients)
- Typography (fonts, sizes, weights, sources, font file URLs)
- Spacing (margin/padding scales)
- Borders (radius, widths, styles, colors)
- Shadows
- Motion (duration scale, easing curves, hover patterns per component type)
- Components (buttons, badges, inputs, links)
- Breakpoints
- Icons & frameworks
Playwright renders the page, dembrandt reads computed styles from the DOM, analyzes color usage and confidence, groups similar typography, detects spacing patterns, and returns design tokens.
Flags
dembrandt dembrandt.com --shadcn # shadcn/ui theme, observed slots only
dembrandt dembrandt.com --dtcg # W3C design tokens, for Style Dictionary or Tokens Studio
dembrandt dembrandt.com --wcag # WCAG 2.1 contrast on real DOM pairsDefault is formatted terminal output only. Every flag below; the detailed reference is docs/usage.md.
Export
Analysis
Shortened. The full README is on GitHub.
Nothing above is checked by us. What we check is on the safety report.
Dembrandt: common questions
- Is Dembrandt MCP server safe?
- Mostly: it is graded B (83/100). Read the Dembrandt safety report
- How do I install Dembrandt?
- It runs on your machine. Copy the Claude Code, Cursor, VS Code or Claude Desktop config from the install section.
- Does Dembrandt need an API key?
- Not as far as the registry entry and our scan can tell: no credentials are declared or required.
- Is Dembrandt maintained?
- The last commit was 2 days ago (2026-10-11). The latest release is v0.39.2.
- What can I use instead of Dembrandt?
- Servers from other publishers that do the same job: melta UI MCP server, Buoy MCP server and Mimic AI MCP server. Compare all Dembrandt alternatives.
Alternatives to Dembrandt
Same job from other publishers: the closest match first, then the best rated.
- melta UIAI-Ready design system MCP: melta UI tokens, component contracts, 107 rules, check_html self-verifynot reviewedEstablishedA
- BuoyDesign tokens and drift checks for coding agents: use the token, not the hardcoded value.not reviewedGrowingA
- Mimic AIBuilds Figma from your design system: real components and tokens, enforced, learning every build.not reviewedGrowingA
Mlola UIMlola UI components, tokens and design rules for coding agents, with a markup checkernot reviewedGrowingA- onsystemKeeps coding agents on your design system: knows your real components, props, variants and tokens.not reviewedGrowingA