Token Guard
A published Figma plugin that finds every raw value that should be a design token, colours, spacing, type, radii and effects, rates each match by confidence, and fixes it in one click.
⤢ Click to zoomWhy I built it
Design systems drift. Tokens get decoupled: someone pastes a raw hex value, a spacing number gets hardcoded, a new component lands without style links. In large files this compounds silently, and the only way to catch it was a slow, manual layer-by-layer audit.
I got tired of running those audits by hand during design-system handoffs. The real question, though, was a curiosity one: could a designer with no plugin-development background actually ship something like this? The answer turned out to be yes.
Building it taught me more about how Figma’s variable and style APIs actually work than any documentation would have.
What it does
Token Guard scans your whole Figma file, or just your selection, and surfaces every raw value that should be using a design token: colours, spacing, typography, radii and effects. It checks each against your local variables, local styles and linked libraries, then assigns a confidence level so you know where to trust the suggestion and where to make a judgment call.
- Whole file or selection. Audit everything at once, or scope it to what you’re working on right now.
- Five value types, three sources. Colours, spacing, type, radii and effects, each checked against local variables, local styles and linked libraries.
- Confidence, not guesses. Every issue carries a confidence level, so you trust the clear matches and judge the ambiguous ones.
- One click, or all at once. Fix a single value, or bulk-apply every high-confidence match in a single pass.
How it works
The rule-based engine handles the majority of cases on its own, with no API calls. The genuinely ambiguous values, where several tokens share the same raw value, are the hard part. For those, an optional Claude-powered layer reads node names and frame context and suggests the right semantic token.
⤢ Click to zoomThe AI is strictly opt-in: bring your own key, and zero data is stored. The rule engine stays the default, so the plugin works fully without ever calling out.
Tech stack
Built solo, with no prior plugin-development background. The audit runs entirely inside the Figma plugin sandbox; the optional AI calls go straight to the Anthropic API with a user-supplied key.