Audit Design Tokens banner
humbleteam humbleteam

Audit Design Tokens

Security community

Description

Find design token drift in a codebase: raw hex colors, off-scale spacing, near-duplicate values

Installation

This entry records only its repository, not the path inside it, so there is no exact command to give. Open the source below and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

README

Audit design tokens

**A Claude Code skill that scans a codebase for design token drift - raw hex colors, off-scale spacing, and near-duplicate values a team stopped routing through its own design system.**

[![CI](https://img.shields.io/github/actions/workflow/status/humbleteam/audit-design-tokens/validate.yml?branch=main&style=for-the-badge&logo=github&label=CI)](https://github.com/humbleteam/audit-design-tokens/actions/workflows/validate.yml) [![GitHub stars](https://img.shields.io/github/stars/humbleteam/audit-design-tokens?style=for-the-badge&logo=github&color=181717)](https://github.com/humbleteam/audit-design-tokens/stargazers) [![Last commit](https://img.shields.io/github/last-commit/humbleteam/audit-design-tokens?style=for-the-badge&color=339933)](https://github.com/humbleteam/audit-design-tokens/commits/main) [![License](https://img.shields.io/badge/license-MIT-blue?style=for-the-badge)](LICENSE) [![Claude Code](https://img.shields.io/badge/Claude_Code-skill-D97757?style=for-the-badge&logo=anthropic&logoColor=white)](https://github.com/humbleteam/audit-design-tokens/blob/main/SKILL.md)

Every design system starts clean and drifts. Someone ships a one-off `#2563EB` instead of `var(--color-primary)`, a `padding: 13px` sneaks past the 4px scale, and nobody can say with confidence which colors are actually tokens anymore. This skill scans a codebase, finds every raw value that should have been a token, and returns a severity-ranked report with a file:line for each finding and a smallest-diff-first plan to fix it.

Table of contents

What it does

  • Finds token definitions in