Design-system reality scanner · v0.4

Ghost watches your design system in production. You pick the canon. Ghost measures the drift. You decide what matters.

Scanning your Figma file against your shipped product.

7 deviations detected · 18 tokens read · 312 nodes walked

Design System
Production

03 steps · one diff

How it reads the gap

  1. 01

    Reads the Figma library

    Pulls variables and component definitions through the Figma REST API. Builds the canonical token map.

    Figma library
  2. 02

    Reads the live DOM

    Walks the production page via headless browser. Captures computed styles per element.

    live DOM
  3. 03

    Emits the deviation set

    Joins both sides at the token level. Lists every property where the live value parted from the spec.

    deviation set

canonical scan · 01

One scan, all the way through

Step 1 ships a single canonical run. The second scan and the connect-your-own card land in Step 4 when the Figma extraction layer is wired.

what ships · what is queued

Today and soon

today

  • intra-Figma drift detection

    Variables, styles, and component definitions audited against each other.

  • token-level deviations

    Diffs land on the token, not the pixel. Spacing, color, radius, weight.

  • AI fix suggestions

    Each deviation arrives with a one-line patch ready to paste into the design or the styles.

soon

  • production-side capture

    Headless browser walks the live product, joins back into the same deviation set.

  • PR-grade exports

    Hand a deviation list to engineering as a checkable list, not a screenshot.

  • scheduled scans

    Cron-driven runs on the surfaces that drift the fastest.