SGL DesignScope

A local-first design-system extraction toolkit for teams that care how interfaces are actually built.

SGL DesignScope is an independently maintained CLI, MCP server, and GitHub Action from Self Graphic Lab. It launches a real Playwright browser, observes rendered design decisions, and turns them into structured output for developers, designers, and AI-assisted workflows.

From rendered page to design-system evidence

The toolkit extracts colors, typography, spacing, radii, borders, shadows, gradients, motion, responsive breakpoints, components, and WCAG contrast relationships. The same local engine can export JSON, W3C DTCG tokens, Tailwind v4 themes, DESIGN.md handoffs, HTML reports, and offline drift comparisons.

Privacy and target safety

Extractions and comparisons stay on the machine running the command. There is no hosted dashboard, snapshot upload, or credential-sync workflow. Public targets are allowed by default while loopback, private, link-local, metadata, internal, and credential-bearing targets are rejected before the browser starts; authorized local analysis requires an explicit allow-private opt-in.

View the open-source repository · View the Automated Content Intelligence Platform · Back to Self Graphic Lab