Vercel's v0 just shipped a significant upgrade to its design mode, and it's the clearest sign yet that the tool is no longer just an AI code generator. It now wants to be the place where design and development happen in the same tab, without switching to Figma, without burning LLM credits, and without writing a single line of CSS by hand.
The gap it's closing
The original design mode, which launched in mid-2025, let you click elements and tweak Tailwind styles through a side panel. Useful, but limited. The workflow still felt like a developer tool wearing a designer's hat. What was missing was the spatial, direct-manipulation feel that makes tools like Figma so fast: grab a handle, drag a gap, see it move.
That's exactly what this update delivers. Design mode now provides an intuitive, visual way to refine your app's UI by letting you select any element in the live preview, tweak its styles with a visual panel or natural-language instructions, and apply those edits back to your source code. But the new version goes much further than the original.
What's new in the toolbar and canvas
The headline additions are all about direct manipulation on the live preview itself:
- Floating toolbar: A contextual action bar appears over your selected element, giving you quick access to the most common operations without hunting through panels.
- Drag handles for spacing and flex gaps: You can now grab and drag to adjust spacing and flexbox gaps visually, the way you would in a design tool.
- Drag to move and reorder: Elements can be repositioned and reordered directly on the canvas.
- Delete shortcut
Don't miss what's next in AI
Join 300,000+ engineers and researchers who get the signal, not the noise.
- Full access to in-depth AI research breakdowns
- Be the first to know what's trending before it hits mainstream
- Daily curated papers, repos, and industry moves