What agents have been missing is a surface for exploration.

AI coding tools have gotten remarkably good at generating UI. Tools like Cursor and Claude can produce a polished interface from a single prompt. You describe a component, hit enter, and seconds later you have JSX, Tailwind classes, even motion states (to some extent).
But there’s a subtle limitation.
They generate one version of your UI at a time.
And when you’re designing — especially as a designer who codes — one version is never enough. Which is what got me thinking about bringing the power of orchestration to the new "designing in code" process.
When working inside code-first IDEs, you’re bound to the current UI state. You can rewrite it or improve it, but can't really explore variations. You can't compare. You can make the button "more playful" and the LLM will change the button but what if you just want to explore different levels of playfulness side by side?
Do you keep recreating it, linearly?
One way is to use the Figma MCP — recreate the coded component in Figma, edit it, try different layouts and push the final one back. But you lose out on the accuracy. What if, instead, you could bring the same Figma capabilities into your IDE?
That's what we've done for our own projects. As a designer, I want to be close to code but not think about the code. It's essentially a new interface layer for designers. We've created a playground that lives on localhost as /playground.
Cursor built the design editor panel. We've built the playground which has only one purpose: to explore variations.
It's a design canvas that you can drop in any project.

You can add any component in the playground, ask your own LLM of choice for variations and they appear as separate instances on the canvas, side by side. Not in a chat thread. Right there, spatially.
Best of all you can create variations of variations. There's no end.

Agents are excellent at generation. What they've been missing is a surface for exploration. The playground gives them that surface, and variation prompting gives you the design workflow.
The result is something that feels like thinking out loud and exploring parallel directions, which is what design is.
⭐ We're now releasing the v1 publicly for you to give it a try. Just run:
npx design-playground@latestAnd yes, it's open source. So you can just download and drag-drop it into your code (documentation).
Two mistakes I made while designing for an AI product
The new AI era requires a new tool, a new prototyping layer for designers.

The shift happened faster than anyone expected.


From ChatGPT to Figma AI, explore the best AI UX patterns from leading products.