B
buoy

Design system drift detector
for AI coding agents

Your AI writes code fast. Buoy catches the design debt.

$ npm install -g @anthropic-ai/buoy
Works with: Claude Code Cursor Copilot Codex

AI agents ship fast but ignore your design system. Hardcoded colors. Arbitrary spacing. Inconsistent props. Buoy finds the drift before it compounds.

Usage

$ buoy drift check # scan whole project
$ buoy drift check src/components/ # specific directory
$ buoy fix --dry-run # preview fixes

What it catches

Hardcoded Values

  • Hex colors instead of tokens
  • px values instead of spacing scale
  • Tailwind arbitrary values [13px]

Semantic Mismatch

  • Wrong token for context
  • primary used for danger actions
  • Heading token on body text

Naming Drift

  • Inconsistent prop names
  • size="sm" vs size="small"
  • variant vs type vs kind

Sample output

$ buoy drift check src/
src/components/Button.tsx
hardcoded-value line 12
color: "#3b82f6"
→ Use token: var(--color-primary)
semantic-mismatch line 24
Using 'primary' for destructive action
→ Consider: var(--color-danger)
src/components/Card.tsx
hardcoded-value line 8
padding: "13px"
→ Use token: var(--space-3)
Found 23 drift signals across 8 files
Run buoy fix to auto-fix 18 issues

From our research

Based on analysis of 1,000+ open source projects

847
avg drift signals
67%
hardcoded values
4x
more in 3yr+ repos
89%
auto-fixable

Use with your AI agent

Claude Code
"Run buoy drift check after making changes"
.cursorrules
Always run `buoy drift check` before committing. Fix any drift signals before marking complete.
CI/CD
- run: npx @anthropic-ai/buoy drift check --fail-on-drift