AI writes code that works but ignores your design system. Buoy finds hardcoded colors, duplicate components, and token violations.
npx @buoy-design/cli begin Paste in your terminal or AI
Hardcoded values creep in. Drift compounds.
const Card = () => (
<div style={{
background: "#ffffff",
padding: "16px",
borderRadius: "8px",
boxShadow: "0 2px 4px rgba..."
}}>
{children}
</div>
)import { Card } from "@/components"
const MyCard = () => (
<Card variant="elevated">
{children}
</Card>
)
One command. Every issue with exact file, line, and suggestion.
Add Buoy to CI. Drift never reaches main.
Hardcoded color #3b82f6
Use var(--color-primary) instead
Hardcoded spacing 24px
Use var(--spacing-lg) instead
Hardcoded border radius 8px
Use var(--radius-md) instead
Categorized by severity to help you prioritize fixes
Components marked @deprecated still in use
Components in code but not in design
Find drift, catch it at CI, and track your progress.
$ buoy drift check Zero config. Every issue with exact file and line.
$ buoy ci Catch drift at PR. Nothing bad reaches main.
$ buoy audit Track design system health over time.
Your journey from first scan to team-wide enforcement
Run buoy check in any project. See every hardcoded value, naming issue, and token violation.
Add GitHub Action. Every PR gets checked. Drift blocked before merge.
Health scores, trend charts, team leaderboards. Prove ROI to stakeholders.
Core drift detection is 100% deterministic. No LLMs, no API keys, no data leaves your machine. Perfect for teams where AI tools are restricted.
Start with Core. Add AI when you're ready. Learn more →
Free. Open source. No signup required.
npx @buoy-design/cli status