dembrandt

by dembrandt · JavaScript · ★ 1,738

Extract any website’s design system into tokens in seconds: logo, colors, typography, borders & more. One command.

#brand-audits#css#design-engineering#design-md#design-ops#design-systems#design-to-code#design-tokens#developer-experience#dx#frontend#mcp#nodejs#open-source#playwright#productivity#reverse-engineering#tailwind-css#ui-audit

Install

npx -y github:dembrandt/dembrandt

Claude Desktop config

Add this to your claude_desktop_config.json:

{
  "mcpServers": {
    "dembrandt": {
      "command": "npx",
      "args": [
        "-y",
        "github:dembrandt/dembrandt"
      ]
    }
  }
}

From the README

[](https://www.npmjs.com/package/dembrandt) [](https://www.npmjs.com/package/dembrandt) [](https://github.com/dembrandt/dembrandt/blob/main/LICENSE) Extract a website's design system into design tokens in a few seconds: logo, colors, typography, borders, and more. One command. Install globally: Or use npx without installing: Requires Node.js 18+ Use Dembrandt as a tool in Claude Code, Cursor, Windsurf, or any MCP-compatible client. Ask your agent to "extract the color palette from example.com" and it calls Dembrandt automatically. Or add to your project's : 7 tools available: , , , ,…

Read full README on GitHub →

💡 Need a managed MCP host?

Try Claude Pro for the smoothest MCP experience, or browse our cloud-hosted servers.

Related developer tools servers

everything-claude-code

affaan-m

★ 170,676

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

Developer Tools · JavaScript