v0 by Vercel
The fastest way to turn a napkin sketch into production-ready React — without writing a single component from scratch.
What This Is
v0 is Vercel's AI UI generator. Describe a screen — dashboard, landing page, pricing table, onboarding form — and v0 renders it in your browser as a working React component in seconds. Not a mockup. Not a wireframe. Real, copy-paste-ready code using the same component libraries professional frontend teams ship every day.
What separates v0 from other AI tools isn't that it generates code — it's which code it generates. v0 is built by the same team that made Next.js, and it shows. The output defaults to shadcn/ui (the de facto standard React component library), Tailwind-styled, TypeScript-typed, structured the way a careful senior frontend dev would write it on a good day. Paste it into your project and it doesn't fight you. It fits.
The workflow: describe what you want, optionally drop in a screenshot, get a rendered preview alongside the code. Iterate by typing follow-ups in the same chat — "make the button larger," "add a dark mode toggle," "move nav to a sidebar." When you're happy, copy the code, open a pull request, or one-click deploy to Vercel.
And v0 outgrew "UI generator" in early 2026. The relaunched v0 is a full-stack agent: it runs in a real sandbox, writes API routes and server actions, connects databases, syncs with GitHub, and can import your existing codebase. UI is still where it shines brightest.
Who Should Use This
Frontend devs who want to skip boilerplate. v0 is a multiplier. Doesn't replace judgment — removes the tedious parts. The mechanical work of importing components, setting up state, getting Tailwind right? Gone.
Designers and PMs who want to ship real code. One of the few tools where someone with no coding background generates output a developer would actually use. Designers prototype with real code instead of static mockups. PMs communicate requirements concretely.
Non-technical founders building on Next.js. v0 now handles more than UI — it can wire a database and API routes through Vercel's integrations. For a Next.js + Supabase + Vercel stack, it's the fastest path to something polished.
What Actually Matters
Live preview, not screenshots. Real interactive HTML in the right pane. Click buttons, scroll, see how it actually behaves before integrating. Iteration is fast enough that it feels like conversation, not tool use.
Image and screenshot input. Paste a competitor's screenshot, a Figma frame, a whiteboard photo — get React back. Fidelity isn't pixel-perfect; it interprets, doesn't copy. But close enough to make experienced devs reconsider how much frontend work actually requires writing from scratch.
shadcn/ui by default. This is the smart choice. You're not getting mystery components — you're getting the same building blocks shipping in thousands of production apps.
Full-stack scaffolding. v0 builds whole features now — pages, API routes, server actions, the database hookup — as separate logical blocks, each with its own code. GitHub sync means it works in branches and PRs like a teammate.
One-click Vercel deploy. Generated UI to live URL in under five minutes. Built by the same team, integrated end to end.
Conversational iteration. Each session keeps context. "Make it sticky on scroll" understands the nav you just built. The way you'd actually work with a designer.
Cost
Credit-based, layered on Vercel accounts.
Free. $5 in monthly credits, capped at 7 messages a day. Genuinely useful if you use v0 weekly, not daily.
Plus $30/user/mo. The tier for active builders — $30 in monthly credits plus a daily login bonus, all models, Figma imports, API access, shared team credits. (The old $20 Premium tier is gone.)
Business $100/user/mo. Bigger limits, training opt-out.
Enterprise. Custom. SSO, audit logs, volume.
Heads up: v0 credits are separate from Vercel hosting costs. Hosting on the Hobby tier is free for most early apps; Pro hosting is another $20/mo. Two line items, not one.
What It's Good At
Web apps: Five stars. Native turf. SaaS, internal tools, marketing sites, customer-facing apps — v0's output is production-grade.
Mobile: Two stars. v0 generates React, not React Native. Useful for prototyping mobile-style layouts in a browser, not for actual native apps.
Local/desktop: Two stars. It's a web UI generator. Period.
Hosting
Streamlined — but Vercel-flavored.
Deploy to Vercel and you get global edge, automatic HTTPS, preview deployments, the works. Hobby tier handles real production traffic for early apps.
What v0 doesn't provide: the backend services themselves. But the Connect panel now wires them in from chat — Supabase (DB + auth), Neon (Postgres), Upstash, Vercel Blob — no config files, no dashboard spelunking. Clerk remains a common auth pairing.
The honest framing: v0 is excellent at the part of web dev that's hardest to automate well — clean UI. The plumbing used to be your problem; now v0 scaffolds it too. Still budget a few hours to review the data layer before real users touch it.
The Story
A consulting firm I know — five people, growing client list, two years of running everything through a shared Google Sheet and a weekly email. Clients replying to wrong threads. Team overwriting each other's cells. They needed a client portal — login, project status, document upload, comments.
The owner isn't a developer. Has a budget. Doesn't have a $15K budget.
She opened v0 on a Wednesday night. Typed: "Client portal dashboard. Left sidebar with Projects, Documents, Messages. Main area shows active projects with status badges (In Progress / Review / Complete), due dates, progress bars. Professional, clean."
Thirty seconds later: a rendered preview nicer than what she'd imagined. Status badges in the right colors. Progress bars at the right proportions. Twenty minutes of refinement and she had a dashboard component she was proud of.
Her nephew — knows some Next.js — set up the project, wired it to Supabase, deployed to Vercel. One weekend. Client portal live two weeks later.
Total cost under $300, his time included.
That's the v0 model. You handle product thinking. v0 handles UI generation. A small amount of engineering connects the pieces.
Where It Bites
It's UI-first, even as a full-stack agent. The 2026 relaunch builds backends now, but the frontend is still what comes out production-grade. Non-technical users who ship the generated data layer without review are trusting it further than I would. It's strongest at one layer — the one users see.
Credit consumption isn't intuitive. Pricing is token-based, and complex full-stack generations eat credits far faster than simple components. Watch the usage meter during heavy design sprints.
Tight Vercel integration is also a constraint. Code is portable to AWS, Netlify, Fly — but the one-click deploy is Vercel-only. Worth knowing.
Standard UI = excellent. Bespoke UI = struggle. Conventional dashboards, landing pages, forms? Beautiful. Highly custom data viz, unconventional animations, bespoke design systems? Output may need more adjustment than it saves. Use it where it's optimized.
Gavin's Rule: Screenshot First, Describe Second
Before typing a description, find a screenshot of a UI you admire — a competitor, a Dribbble post, a product you respect — and paste it into v0 as your starting point.
"Here's roughly what I want" gets you further than three paragraphs of description. The visual input produces better proportions, spacing, and color decisions than text alone.
Once v0 has something close, then use text follow-ups to refine. Screenshot first, describe second. Iteration is faster, output is sharper, and you'll spend less time fighting with the AI's interpretation of your words.
Bottom Line
v0 is the best tool available for generating production-quality React + Next.js UI from a description or screenshot. It's not close. Vercel is betting the company on it too — a $300M raise at a $9.3 billion valuation and four million v0 users say this isn't a side project.
If you're building web apps and not using v0 to accelerate frontend work, you're leaving real time on the table.
It'll scaffold your backend now, but review that work before you trust it. For the UI layer users actually see and touch, the output is consistently clean enough to ship.
Pair with Vercel for hosting, Supabase for data, and you have one of the most efficient paths from idea to working web app available today.
— Gavin