Advanced Techniques
Master advanced prompting techniques to get the most out of v0
Iterative Refinement
One of the most powerful techniques for working with v0 is iterative refinement. Instead of trying to get the perfect result in a single prompt, start with a basic request and then refine it through follow-up prompts.
Initial Prompt
Create a pricing table for a SaaS product with three tiers: Basic, Pro, and Enterprise.
Refinement Prompt
Great! Now add a monthly/yearly toggle at the top, and show a 20% discount for yearly plans. Also, add a "Most Popular" badge to the Pro tier.
Final Refinement
Perfect! Now add a comparison table below the pricing cards that shows the features included in each tier in more detail.
Specifying Design Systems
v0 can work with various design systems and UI libraries. You can specify which one you want to use in your prompt.
Using Tailwind CSS
Create a contact form using Tailwind CSS with input fields for name, email, subject, and message. Include form validation and a submit button.
Using shadcn/ui
Create a contact form using shadcn/ui components with input fields for name, email, subject, and message. Include form validation and a submit button.
Generating Complex Functionality
v0 can generate complex functionality by breaking down the task into smaller components and explaining the relationships between them.
Create a task management application with the following features:
1. A form to add new tasks with fields for title, description, due date, and priority
2. A list view of all tasks with the ability to filter by status (completed, in progress, not started)
3. The ability to mark tasks as complete, edit task details, and delete tasks
4. A dashboard that shows task statistics (total tasks, completed tasks, overdue tasks)
Use Next.js App Router, React Server Components where appropriate, and Tailwind CSS for styling. Store the tasks in local storage.
Providing References
You can provide references to existing designs or components to help v0 understand your vision better.
Reference by Description
Create a testimonial section similar to the one on the Stripe homepage, with customer quotes, logos, and a carousel navigation.
Reference by Image
I've attached a screenshot of a dashboard I like. Create a similar dashboard layout with a sidebar navigation, header with user profile, and main content area with statistics cards and a data table.