Use this trick to create UI elements with Cursor + v0

Hi,

If you’re new to Cursor, here’s a guide to all the shortcuts you need to know, and how to customize them:

On another note, have you ever tried generating UI with Cursor? I did. It’s pretty bad.

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

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!

Here’s a simple demo I recorded, where you can see this workflow in action:

In the next issue, we’ll build a directory website using Cursor and v0 in under 1 hour. So, stick around if you want to see that.

Until then, try using this workflow in your own projects. Reply to this email with what you’ve created, and we will include it in the next newsletter issue as well. Have fun building!

Best,
Constantin