Nobody breaks a design system on purpose. It just stops being true, one shortcut at a time, until the product your team ships barely resembles what your Figma file says it should look like.
I keep running into a version of this story. An organization builds a real design system: tokens, governed components, actual adoption. It works. Then AI-assisted development takes over the daily building, context engineering and all the vibes that come with it, and the system starts quietly losing ground.
How a Design System Gets Infected
Here’s why this happens specifically because of AI. An agent doesn’t know your design system exists unless someone puts it directly in its context. Left to its own defaults, the fastest path to a working component is to generate one, or pull one from wherever, not to go find the governed version and use that instead. Do that across every ticket, for long enough, and the actual codebase drifts a long way from whatever your documentation still claims is true.
The dangerous part isn’t that the system disappears. It’s that everything around it still looks intact. There’s still a Figma file. There’s still a component library. There’s still documentation with your name on it. Nobody goes back to check whether the product still matches any of it, because why would you doubt something that used to be true.
You Can’t Fix What You Can’t See
The traditional design systems path runs one direction: canonical source in Figma, forward through tokens and components, into a product. That order assumes the canonical source is still accurate. Once a system has been quietly infected for a while, it usually isn’t.
I just added a set of design systems extraction tools to Figma Console MCP built for this exact problem. Point them at a repository and they analyze the codebase as it actually exists right now, extract the design tokens, extract the components, and scaffold a Storybook instance around what they find. Then they run a deterministic evaluation pass to confirm the extraction matches what’s actually running in production, not what a comment or a doc claims it does. They detect your framework automatically, React, Vue, Web Components, whatever, and set up the right flavor of Storybook accordingly.
Run this against a codebase that’s drifted and you don’t get a redesign. You get an honest inventory: here’s what’s actually in your product right now, whether or not it matches what you think your system says.
Rateshare Was the Simple Case
I ran the tools against Rateshare, an app I vibe coded from nothing, to show how the extraction itself works. Worth being straight about what this does and doesn’t prove: Rateshare never had a design system to drift from, so this demo shows the mechanics, not the infection. The tool doesn’t care which case it’s pointed at. It reads what’s actually in the repository either way, whether that repository started with nothing or started with a real system that quietly stopped being true.
One prompt: extract the tokens, extract the components, run the evals, spin up Storybook. The tools detected React, found 21 components, and ran a deterministic evaluation through Playwright, opening an actual browser to check each rendered component against the real thing instead of trusting Storybook’s own preview.
What came back: a small, restrained token set, a couple of type sizes, one icon, a simple semantic color palette, and a component inventory running from buttons and avatars up through a full node card, the actual feed item with all its interactive states built in. For an app with zero design intent going in, that’s a real inventory. Point the same tools at a codebase that used to have one, and you’d see exactly where it stopped matching.
Design Systems Matter More Now, Not Less
It’s tempting to think design systems matter less as AI makes it easier to build fast. I’d argue the opposite. The easier it gets for an agent to route around your system, the more that system needs a way to catch itself when it’s been routed around.
A design system nobody’s checking against the actual product isn’t a design system anymore. It’s documentation of something that used to be true.
The extraction tools are live now in Figma Console MCP, open source. If your organization has a design system you haven’t actually checked against your product in a while, point the tools at it and see what’s changed.
