Anyone who has let an AI coding agent loose on a frontend codebase knows the feeling: you merge a PR, open the app, and something looks... off. A button color shifted. Font weights changed. Spacing is slightly wrong. The agent did exactly what you asked, but it also quietly overwrote a CSS variable or swapped a semantic HTML element along the way.
Drift-guard is a new open-source CLI tool built to catch exactly this problem. It works by taking a snapshot of your design tokens (colors, fonts, spacing, shadows, border radii) and DOM structure, then comparing future code changes against that baseline. No AI tokens consumed, no MCP server to configure. It runs as a pure CLI check you can drop into your CI pipeline or run before committing.
The workflow is simple: run drift-guard init to scan your CSS and HTML and create a baseline snapshot. Then run drift-guard check after any code change to see if design tokens or structural semantics shifted from that baseline. If something drifted, you get a clear report of what changed and where.
This solves a real pain point. Tools like Cursor, Claude Code, and GitHub Copilot are fast at generating code, but they have no concept of your design system's boundaries. They will happily change --color-primary from #2563eb to #3b82f6 if it seems close enough, or swap a <nav> for a <div> because it produces the same visual result. These changes are technically correct but semantically wrong, and they accumulate into design rot that is tedious to track down manually.
The tool is open source and available now. For teams that rely heavily on AI-assisted coding for frontend work, adding a drift check to your pre-commit hooks or CI is a low-effort way to keep your design system honest.