How to generate UI with Cursor and v0

Have you ever tried to generate UI elements with Cursor? It's not the best.

Cursor is great at implementing features or fixing bugs, not so much UI design. This is where v0 by Vercel comes in.

Cursor + v0 Workflow

Here’s a workflow you can use, which creates a v0 prompt straight from Cursor Composer:

0. Make sure you have shadcn installed in your project.
1. Create a v0.md file. Inside, add the following prompt:

- Think carefully about the component
- Generate a prompt
- Then with the prompt create a clickable link: [component name](https://v0.dev/chat?q={prompt})
- Make sure prompt is url encoded

2. Open up Cursor Composer with SHIFT + CMD + I (MacOS) or SHIFT + CTRL + I (Windows).
3. Describe what you want to build and mention the prompt file with @v0.md.
4. Click the v0 link and modify your component, or leave it as is.
5. Add the component to your codebase…and you’re done!

See it in action

Let's use this workflow to generate a sign up form. Here’s a simple demo I recorded, where you can see it in action:

With this workflow, you don't have to come up with a long prompt. Cursor generates it, so you can focus on building your app.