The Lovable Prompting Bible

A shared folder with AI prompts and code snippets

From workspace: Lovable

Team: Prompt library

Total snippets: 23

Lovable

The Lovable Prompting Bible

23 snippets

Writing Better Prompts to Avoid Errors

A well-structured prompt reduces debugging time. Use this best practice format:

- Project Overview – Describe what you’re building. - Page Structure – List key pages and components. - Navigation Logic – Explain user movement through the app. - Screenshots/Wireframes – Provide visuals if available. - Implementation Order –...

super prompts from an X user

Perform a comprehensive regression and audit of the codebase to determine if its architecture is clean, modular, and optimized. Pinpoint any files, components, or logic that are incorrectly placed, not allocated to suitable files, or require...

Chat Mode

:Troubleshooting—ask AI to analyze errors before making changes. Go to your account settings and enable Labs feature.

Follow this plan and act on all those items

Default Mode

High-level feature creation.

Review the app and tell me where there is outdated code.

Stripe

Stripe seamlessly integrates with Lovable and can be set up with minimal effort. However, there are several factors that may hinder Stripe's functionality. *Disclaimer: Use your Stripe Secret Key and Webhook Signing Secret securely in the Supabase Edge Function Secrets and avoid including them in the prompt for safety.*

Initiate a Stripe connection in test mode using the configuration detailed below: Utilize the specified product and pricing details: Product IDs are [Your Product IDs], with a pricing model of [One-time or Subscription]. Set the webhook endpoint...

Step by Step

Avoid assigning five tasks to Lovable simultaneously! Doing so may lead the AI to create confusion. Here’s a better approach. This step-by-step process enables AI to concentrate on one task at a time, reducing the likelihood of errors and hallucinations.

Start with Front design, page by page, section by section. The plug backend using Supabase as Lovable integration is natively built! Then, refine the UX/UI if needed.

Details

When working with Lovable, it’s crucial to provide the AI with clear and specific requests. Rather than simply saying, "move the button to the right," try stating, "in the top header, shift the sign-up button to the left side of the page, ensuring the styling remains consistent." The more precise your instructions are, the fewer errors you’ll encounter, and you’ll save on credits! Basically, I always suggest adding instructions on how you want Lovable to approach every task. My example.

Key Guidelines: Approach problems systematically and articulate your reasoning for intricate issues. Decompose extensive tasks into manageable parts and seek clarification when necessary. While providing feedback, elucidate your thought process...

Mobile First

he issue (and somewhat hidden truth) is that most developers prioritize desktop design simply because it looks better on a large, vibrant screen. However, the reality is that we should have been focusing on mobile-first design for years now. A great prompt that was shared by a Champion on Discord. But if you're already far along into your project, you can fix this by telling it to update things to be responsive starting with the largest layout components down to the smallest. Then get to the individual components.

Always make things responsive on all breakpoints, with a focus on mobile first. Use modern UI/UX best practices for determining how breakpoints should change the components. Use shadcn and tailwind built in breakpoints instead of anything custom,...

Understand Before You Build

Review the Knowledge Base and summarize the project to ensure clarity before coding.

Before you write any code, please review the Knowledge Base and share your understanding of my project.

Application or user flow

This clarity will aid the AI model in understanding the connections between pages and processing all features and limitations effectively.

Users begin their experience on the landing page, where they can click the sign-up button to register with Google, subsequently accessing the dashboard. The dashboard comprises X sections.

Lock Files

Lovable currently lacks a built-in file locking system. However, you can guide the AI with slight modifications to your prompts. Just include this instruction in each prompt: "Please refrain from altering pages X or Y and focus changes solely on page Z." You can also try this prompt if you are updating an existing feature without the intention of modifying something sensible:

This update is quite delicate and requires utmost precision. Carefully examine all dependencies and potential impacts before implementing any changes, and test systematically to guarantee nothing is disrupted. Steer clear of shortcuts or...

Diff & Select

Whenever you request Lovable to implement a particular change in any file, it will rewrite the entire file or modify the existing content. To ensure that the AI only updates relevant files, provide clear instructions. This approach encourages the AI to edit only the necessary sections, resulting in minimal changes to just a few lines of code. By doing so, you can reduce loading times and prevent error loops. An effective prompt I’ve applied previously when adjusting an existing feature is:

Implement modifications to the feature while ensuring core functionality, other features, and processes remain unaffected. Evaluate its behavior and dependencies to identify potential risks, and discuss any concerns before moving forward. Conduct...

Starting a new project

Use this proven structure for starting a new project: "However, we consistently recommend that users begin with a blank project and gradually build upon it. This approach allows the AI to grasp the fundamental concepts effectively before delving into the specifics."

Start with "I need a [type] application with:" Elaborate on tech stack - including Frontend, styling, Authorization and Database. Elaborate on core features including main and secondary features. Then direct the AI to start somewhere like: "Start...

Enhance Prompt

The quality of your prompts significantly influences the output of AI. This is the essence of effective prompting: the more refined your prompt, the higher the quality of the output you receive. A comprehensive and well-organized prompt can save you both credits and time by reducing errors. Therefore, these steps are definitely worth considering:

Provide as much details as you can in the input field. Use the "Select" feature to precise edit your component. Enhance your prompt with the experimental "Chat mode".

Reverse Meta Prompting

When debugging, have AI document the process for future use:

Summarize the errors we encountered while setting up JWT authentication and how they were resolved. Create a detailed prompt I can use next time.

Meta Prompting

Leverage AI to refine your prompts:

Rewrite this prompt to be more concise and detailed: 'Create a secure login page in React using Supabase, ensuring role-based authentication.'

No Training Wheels

More conversational prompts while maintaining clarity.

Training Wheels Prompting

A structured, labeled approach for clear AI instructions: # Context ## Task ### Guidelines #### Constraints

You are a world-class prompt engineer. Write me a prompt that will generate a full-stack app taking an input of name, number, and company, and generate a company report.

The Four Levels

Mastering Prompting

Understanding the AI’s "Mindset"

AI models, including those powering Lovable, do not "understand" in a human way—they predict responses based on patterns. To guide them effectively:

- Be explicit: Instead of “build a login page,” specify “create a login page using React, with email/password authentication and JWT handling.” - Set constraints: If you need a specific tech stack (e.g., Supabase for authentication), state it...

Why Prompting Is Critical for AI Development

Unlike traditional coding, AI applications rely on structured communication. Providing AI with clear context and constraints ensures high-quality output. In a Lovable expert session at Lovable, Mark from Prompt Advisors demonstrated how developers...

TL;DR:

- Effective prompting matters: Structure your prompts to save hours of troubleshooting. - Meta prompting: Use AI itself to refine your prompts for better accuracy. - Reverse meta prompting: Save debugging sessions to optimize future requests. -...

About

Most people think prompting is just typing a request into AI and hoping for the best. Wrong. The difference between getting a mediocre response and having AI build entire workflows for you comes down to how you prompt. Whether you’re a developer...

Lovable - The Lovable Prompting Bible - AI Prompts & Code Snippets | Snippets AI