Project 02 Figma Plugin · Personal

Design System Lint

As design files grow, elements quietly drift away from their tokens - a hardcoded hex here, a detached text style there. Catching that by hand is tedious enough that nobody does it. This plugin makes hygiene a one-click habit.

Type: Figma plugin
Role: Everything - concept, design, build
Core trick: Context-aware token matching
Companion to: Design System Architect

At a glance

What it is: A Figma plugin that finds every element detached from design tokens and reattaches the right one, in bulk.
The problem: Growing files drift from their tokens; manual audits are tedious enough that they simply don't happen.
My role: Everything - concept, UX, visual design, and the build itself.
Key idea: Context-aware matching: when tokens share a hex value, the element's role (background, border, icon, text) decides which token it gets.
What it shows: Care for design-system hygiene at scale - the maintenance half of systems work most portfolios skip.
Status: Working build - companion to Design System Architect.

What it does

Select any frame - or several - and get a live audit of every element not attached to a design token.
Apply the correct tokens to all flagged elements in bulk, instead of hunting them down one by one.
When multiple tokens share the same hex value, the plugin reads the element's context - is this color a background, a border, an icon, or text? - and attaches the semantically correct token, not just a color match.
Token attachment is mode-aware: once attached, the file switches cleanly between light, dark, or any custom mode with no manual rework.

In the plugin

Design System Lint plugin panel running a live audit: detached elements listed by type with counts and a bulk-fix action — Fig. 01 - Live audit: every detached element, found and listed

Role-matching view: the same hex value resolved to different semantic tokens depending on whether it is used as background, border, icon or text — Fig. 02 - Same hex, different roles: context decides the token

Why it exists

Design System Architect sets the standard; this plugin sustains it - the last and hardest step of 5S. A design system that isn't audited decays into suggestions. This turns the audit from an afternoon of tedium into something a designer will actually run before every handoff.