Design systems break silently. Ghost makes the drift visible.
Ghost is a self-initiated design-system reality scanner I designed and built end to end in code, running on 65 unit and 22 end-to-end tests at $0 a month. It compares the Figma source of truth against what production actually renders.
Nobody checks if production matches the spec.
A hardcoded padding here, a hex digit there, a radius eyeballed from 8 to 6. None are bugs. All pass code review. Six months later, your product is three products wearing the same logo.
Chromatic, Percy, and Applitools catch regressions against previous code. None answer the designer's question: does production match the design system?
Designers check work by holding the spec next to the output.
Spec on one side, production on the other, gap visible in one motion. No report required.
Drag left to reveal production drift. Annotations name what changed.
Drag to reveal. Detect, diagnose, remediate.
Markers carry the diagnosis: red for breaking, amber for drift, blue for undocumented variants. The AI Fix Flow closes the loop in one workflow.
Three pivots made Ghost what it is.
The slider moved from buried feature to hero. The first build hid it three clicks deep. I rebuilt the dashboard around it.
The dashboard became an investigation workspace. Dashboards monitor; Ghost investigates. Spec, production, and deviations sit visible at once.
Detection became remediation. Early Ghost stopped at 'here's the problem.' The AI Fix Flow turned an audit tool into a fix tool.
The first severity language. Ghost shipped critical, high, medium, low.
Detection runs at the token level.
Drift starts at the token, where designers don't look. A pixel diff says something changed. A token diff says which rule broke, which is the version an engineer can act on.
Seven deviations on prepared demo data, traced to their tokens.
Four view modes, plus accessibility as a first-class signal.
Timeline is the one I have not seen elsewhere: the same page at four points in time, drift accumulating. WCAG failures surface inside the drift story: found 2.8:1, required 4.5:1.
Click any chip to compare design against production.
Clinical precision as the visual identity.
Clash Display for headings, DM Sans for body, JetBrains Mono for data. The tone is surgical: "deviation detected," not "violation found." Drift isn't anyone's fault, and the tool shouldn't assign blame.
Color where it carries meaning.
I keep color on what carries meaning. Severity dots hold the drift signal; text labels go neutral.
Restraint.
The half of the problem I couldn't solve at LexisNexis.
Ghost started from a gap I hit at LexisNexis. The token pipeline we shipped solved how tokens get defined, not whether production uses them. Ghost is the half I couldn't solve the first time, now live at ghost.rotemgotlieb.com.
The live demo scans Meridian UI, a payments dashboard built as Ghost's canon, and reports 7 deviations on prepared data. Behind it: 65 unit tests, 22 end-to-end tests, Lighthouse 0.95+ on every route, zero type suppressions, $0 a month to run.
What I'd do differently: start with the comparison slider on day one, not the monitoring dashboard. Conventional is invisible.
Next target: Figma OAuth and a live scan pipeline, so any team can point Ghost at its own canon.
Triage. Three of twenty-one need attention.