Natt, Design Engineer (last month)3 min read
Any sufficiently advanced technology is indistinguishable from magic.
— Arthur C. Clarke
I spent July 4th week with Anthropic's new Fable 5 model.
For fun, I build my own design system. It's a handful of React components, some built on top of Base UI. I had been redoing my button component with a very nice radial gradient effect for the primary variant, and I was excited about the update because it looked great in both light and dark mode. Then I pushed the changes, and a seemingly unrelated blur effect broke on all of my web projects.
The regression surprised me. I've been writing CSS since high school, I do this kind of work professionally, and I understand every line that goes into my design system. Using Cursor, I asked Anthropic's newest model on max mode to take a look.
My prompt was very simple:
565933a
This commit broke all the backdrop blur
My daily driver is ChatGPT 5.5 extra high, and after a few moments of thinking, all it did was revert my design system package update, which is absolutely not what I wanted. I wanted to understand why it broke first, and then fix it.
Fable took a different path, and I was struck by how many steps it worked through to track down the regression.
First it explored my files, then scanned my design system's output to compare the previous and current code for anything suspicious that could have broken the blur effect.
When the static analysis concluded that my CSS changes "look benign so far", it moved on to experiments. In the background, it opened Google Chrome and ran Puppeteer to screenshot the previous and current versions of the website side by side. Then it injected a series of CSS experiments, toggling position-related properties to see if it could reproduce the regression.
After a few iterations, it found the culprit: my button component needed isolation: isolate, because Chromium breaks backdrop-filter when a mix-blend-mode element shares its stacking context. And it didn't just explain the issue, it fixed it in the project I was working in. And then, because I keep all my GitHub repositories cloned locally, it went into the design system's own repository and patched the button component at the source.
Wow... that's impressive.
It turns out this is a known Chromium bug that is still open today.
What sticks with me is that from one simple prompt, the model correctly deduced the cause, ran experiments with real tools, and fixed the issue both in my project and in the design system package it comes from.
I find it so cool that from one prompt, Fable was able to correctly find out the issue from running real experiments and than fixing it in a different codebase on my computer. Admittedly, if I had done any of this manually, it would have taken me much longer to solve this bug.
Fable has earned its place as my new daily driver.
If this model isn't the turning point, one in the near future will be the moment software engineers start spending less time typing and more time directing.