Design Token Cleanup: Retire Colors and Spacing That Drifted

Design token cleanup starts when colors, spacing values, shadows, and aliases no longer represent the product system. The hard part is proving a token is drift rather than a published contract used by downstream components.

The useful output is a token retirement pull request with reference graph, replacement mapping, screenshots, accessibility notes, and migration guide. Keep the review concrete: Deprecate semantic tokens before deleting published names, then make the next action visible to the team that owns the risk. That matters because the cleanup can still go wrong when removing tokens still used by published components.

Key takeaways

Treat each cleanup candidate as an owned system with dependencies, not anonymous clutter.
Use one design-system release cycle plus downstream adoption time before deciding that “quiet” means “unused.”
Prefer reversible changes first when removing tokens still used by published components is still plausible.
Leave behind a token retirement pull request with reference graph, replacement mapping, screenshots, accessibility notes, and migration guide so the next review starts with context.
Measure the result as lower spend, lower risk, less operational drag, or clearer ownership.

Map Token Contracts

Start with one design-token package across token definitions, component usage, documentation, generated CSS, themes, and published versions. The best cleanup scope is small enough that owners can answer quickly but wide enough to include the attachments that make removal risky.

Field	Why it matters
Owner	Cleanup needs a person or team that can accept the decision
Current purpose	A short reason to keep the item, written in present tense
Last meaningful use	owners, callers, last change, runtime behavior, and deletion confidence
Dependency evidence	repository search, tests, logs, deploy history, and owner review
Risk if wrong	The outage, data loss, access failure, or rollback gap the review must avoid
Next action	Keep, reduce, archive, disable, remove, or investigate

Do not make the inventory larger than the decision. A short list with owners and evidence beats a perfect spreadsheet that nobody is willing to act on.

Token Evidence to Check

The useful question is not “how old is it?” It is “what would break, become harder to recover, or lose accountability if this disappeared?” For design token cleanup, collect enough evidence to answer that without relying on naming conventions.

Check	What to look for	Cleanup signal
Token references	Components, theme maps, generated CSS variables, docs, examples, and downstream packages	No supported surface uses the token
Semantic role	Alias chain, design intent, accessibility role, and replacement token	The token duplicates or contradicts the current system
Published contract	Package versions, changelog, consumers, and migration guides	Consumers can move without silent visual changes
Visual effect	Screenshots, contrast checks, spacing rhythm, and component states	The replacement preserves intended UI behavior

Use several signals together. Activity can miss monthly jobs and incident-only paths. Ownership can be stale. Cost can distract from security or recovery risk. The strongest case combines runtime data, dependency checks, owner review, and a rollback plan.

If the evidence conflicts, label the item “investigate” with a named owner and review date. That is still progress because the next review starts with a narrower question.

Example Evidence Check

Map token references across source, generated CSS, docs, and downstream packages before deleting names.

rg "${TOKEN_NAME}|--${TOKEN_NAME}|token\('${TOKEN_NAME}'\)" src packages docs
rg "${TOKEN_NAME}" dist storybook public examples
rg "deprecated|replacement|migration" packages/design-system docs

Treat the output as a candidate list. Do not pipe these checks into delete commands; add owner review, dependency checks, and a rollback path first.

Deprecate Before Deleting

Use the least permanent move that proves the decision. In design token cleanup, removal is only one possible outcome; reducing size, narrowing permission, shortening retention, archiving, or disabling a trigger may produce the same benefit with less risk.

Deprecate semantic tokens before deleting published names.
Move components to replacement tokens before removing raw values.
Publish migration notes for downstream design-system consumers.

Track the cleanup candidate with a simple priority score:

Score	Good sign	Bad sign
Impact	Meaningful spend, risk, toil, noise, or confusion disappears	The item is cheap and low-risk but politically distracting
Confidence	Owner, purpose, and dependency path are understood	The team is guessing from age or name
Reversibility	Restore, recreate, re-enable, or rollback path exists	Deletion would be the first real test
Prevention	A rule can stop recurrence	The same pattern will return next month

Start with high-impact, high-confidence, reversible candidates. Defer confusing items only if they get an owner and a date; otherwise “defer” becomes another word for keeping waste permanently.

Tokens Downstream Apps Use

Some cleanup candidates are supposed to look quiet. Do not rush these cases:

Theme aliases, white-label brands, accessibility states, and exported CSS variables.
Tokens referenced by downstream apps outside the current repository.
Visual changes hidden in hover, focus, disabled, dark, or high-contrast states.

For these cases, use a longer observation window, explicit owner approval, and a staged reduction. The point is not to avoid cleanup; it is to avoid making the first proof of dependency an outage.

Run the Token Cleanup PR

Run design token cleanup as a decision review, not an open-ended hygiene project.

Pick the narrow scope and export the candidate list.
Add owner, current purpose, last-use evidence, dependency checks, and risk if wrong.
Remove obvious false positives, then ask owners to choose keep, reduce, archive, disable, remove, or investigate.
Apply the least permanent useful change first.
Watch the signals that would reveal a bad decision.
Complete the final removal only after the review window closes.
Save a token retirement pull request with reference graph, replacement mapping, screenshots, accessibility notes, and migration guide.

For broader cleanup planning, use the cleanup library to pair this guide with related notes. If the cleanup has infrastructure impact, pair it with a visible owner, a rollback path, and a measurable business case. For infrastructure cleanup, the main cloud cost optimization checklist is a useful companion.

Make Tokens Explain Themselves

Prevention should change the creation path, not just the cleanup path. For design token cleanup, the useful prevention fields are owner, reason to exist, removal trigger, and verification notes. Make those fields part of normal creation and review.

Require new tokens to name semantic purpose, owner, and allowed component families.
Report raw values and unused aliases in design-system CI.
Review token drift during component deprecation work.

The recurring review should be short: sort by impact, pick the unclear items, assign owners, and close the loop on anything nobody claims. If the review keeps producing the same class of candidate, fix the creation path instead of celebrating repeated cleanup.

Example Decision Record

Use a compact record so the cleanup can be reviewed later without reconstructing the whole investigation.

Field	Example entry for this cleanup
Candidate	Stale design tokens in frontend systems
Why it looked stale	Low recent activity, unclear owner, or no current consumer after the first review
Evidence checked	Token references, Semantic role, and owner confirmation
First reversible move	Deprecate semantic tokens before deleting published names
Watch signal	The metric, alert, job, route, query, or owner complaint that would show the cleanup was wrong
Final action	Keep, reduce, archive, disable, or remove after one design-system release cycle plus downstream adoption time
Prevention rule	Require new tokens to name semantic purpose, owner, and allowed component families

This record is intentionally small. If the decision needs a long narrative, the candidate is probably not ready for removal yet. Keep investigating until the owner, evidence, reversible move, and prevention rule are clear.

FAQ

How often should teams do design token cleanup?

Use one design-system release cycle plus downstream adoption time for the first decision, then set a recurring cadence based on change rate. Fast-moving non-production systems may need monthly review; slower systems can be quarterly if every unclear item has an owner and a review date.

What is the safest first action?

The safest first action is usually ownership repair plus evidence collection. After that, deprecate semantic tokens before deleting published names. That creates a visible test before permanent deletion.

What should not be removed quickly?

Do not rush anything connected to theme aliases, white-label brands, accessibility states, and exported css variables. Also slow down when the cleanup affects recovery, compliance, customer-specific behavior, rare schedules, or security response.

How do you make the decision useful later?

Write the decision as a small operational record: candidate, owner, evidence, chosen action, watch signals, rollback path, final date, and prevention rule. That format helps future engineers, search engines, and AI assistants understand the cleanup without guessing.