Figma drift
The design library publishes 207 specimen variants that encode variable values as component variants. That is the only route to Figma variable values on our plan, since the Variables REST API is gated to Enterprise.
The join is string equality on -- plus the variant name, with no normalisation. 142 agree, 12 drift, 3 cannot be compared, and 50 name no CSS token.
How current this page is
| The file last changed in Figma | 2026-10-08 10:28 UTC |
| This page read Figma | 2026-10-15 21:25 UTC |
Compare the first date against when you last published. If you published after it, this page has not read your change yet, and the findings below are measured against the library as it stood before.
The site re-reads Figma every hour, so a publish reaches this page within about an hour. Report it if it takes longer.
Publish the library. The site reads published components, so an edit that has not been published does not appear here however long you wait.
Drift
| token | side | Figma | CSS | CSS verdict |
|---|---|---|---|---|
--color-azure-950 | light | #111827 | #141414 | house |
--color-surface-highlight | dark | #111827 | #141414 | house |
--color-surface-info | dark | #040b24 | #0b1b56 | house |
--color-surface-success | dark | #05140e | #0e3828 | house |
--color-surface-warning | dark | #1c1304 | #50350c | house |
--color-surface-error | dark | #180407 | #440c15 | house |
--color-content-subtle | dark | #787878 | #737373 | house |
--color-edge-info | dark | #14329f | #102984 | house |
--color-surface-highlight | light | #e4e9fc | #eff3fa | house |
--radius-sm | light | 2.0 | 0.25rem | vendor |
--font-size-3xl | light | 30.0 | 1.75rem / 2rem | inert |
--font-size-4xl | light | 36.0 | 2rem / 2.25rem | inert |
12 drifted rows, 11 distinct causes. An alias chain propagates one wrong primitive into several rows:
--color-azure-700→--color-edge-info--color-azure-800→--color-surface-info--color-azure-950→--color-azure-950,--color-surface-highlight--color-blue-100→--color-surface-highlight--color-green-800→--color-surface-success--color-neutral-550→--color-content-subtle--color-red-800→--color-surface-error--color-yellow-800→--color-surface-warning--font-size-3xl→--font-size-3xl--font-size-4xl→--font-size-4xl--radius-sm→--radius-sm
Not comparable
| token | Figma | CSS | why |
|---|---|---|---|
--color-red-950 | #2d1114 | None | css value does not resolve |
--font-sans | SF Pro | -apple-system, BlinkMacSystemFont, 'Segoe UI', R | font stacks are not comparable to a resolved face |
--font-mono | SF Mono | "SFMono-Regular", "SF Mono", "Segoe UI Mono", "R | font stacks are not comparable to a resolved face |
This class exists to stop the numbers lying. Counted as drift, a font stack compared against a resolved face looks like a design defect; counted as a match, a self-referential CSS token looks fine.
Specimens naming no CSS token
| family | count |
|---|---|
| chart palette (graph-/span-) | 42 |
| other | 8 |
The chart palette is one naming decision, not many. Figma publishes graph-* and span-*; our CSS declares --series-0 through --series-9. Same colours, unrelated names, and different cardinality — so this is a decision about which name is canonical, not a rename.
What this page cannot tell you
One capture, not a series. This says what Figma held at 2026-10-15T21:25:43+00:00, not whether it is drifting. The capture is not reproducible: there is no sha to pin.
Specimens cover five of twenty-two dimensions, and there is no dark-side primitive specimen, so primitive dark values are unchecked.
A match proves agreement today. It says nothing about whether the Figma variable is bound to anything a designer actually uses.
It counts and does not judge. Which side of a drifted row is right — the CSS or the library — is not a question the join can answer, and this page does not prioritise, recommend, or show a trend.