Complete guide to Lovable
Getting started
Go to lovable.dev and create an account. Start a new project by describing the application you want to build in one sentence (for example, "a booking website for a hair salon"). Lovable works in three modes: Chat/Plan (you think and plan without using credits, nothing is changed yet), Agent (actually builds the code), and Visual Edits (you adjust the design by clicking directly on elements). To get off to a good start, let it show you a plan of what it will build first, review it, and only then ask it to execute.
Use cases
Build a complete application from a description
Generate a React frontend, a database backend (Supabase), and user authentication from a plain-language conversation.
Quick prototypes to validate an idea
Launch a first working version of a product in minutes, without a development team, to test it with real users.
Visual tweaks without writing prompts
With Visual Edits, you click directly on buttons, sections, or components and ask for style or design changes, combining no-code editing with AI.
Connect payments and a database
Set up Stripe for payments and Supabase to store user data, all by describing it in plain language without writing SQL.
Advanced setup
- Chat/Plan modeUse it to think, plan, and debug before building. It doesn't use credits because nothing in your project changes until you approve the plan.
- Agent modeBuilds the code autonomously: it explores your project, debugs proactively, and searches the web if it needs up-to-date information to solve a problem.
- Visual EditsSwitch to the visual editor view to fine-tune spacing, colors, and component positions precisely, instead of describing them in text.
- Supabase and GitHub integrationLovable generates the complete database schema (tables, relationships, security) from your description, and automatically syncs every change to a GitHub repository that you control.
Tips
- Break large requests into smaller steps ("add the login page", then "connect the login to Supabase") instead of asking for everything in a single message: it greatly improves accuracy.
- Use Chat/Plan mode to review what Lovable is going to build before you approve it: it saves you credits spent on changes you didn't want.
- For fine design adjustments (spacing, alignment, colors), use Visual Edits instead of trying to describe them in words: it's much more precise.
- Take advantage of the GitHub sync: if something goes wrong, you can always review the change history outside Lovable.
- When you run low on credits in the middle of a big change, group your next requests into a single, detailed message instead of sending several separate ones.
FAQ
Is Lovable free to use?
It has a free plan with a limited number of credits per month. Paid plans (from $25/month) add more credits and features such as custom domains.
Do I need to know how to code?
No, Lovable is designed so you describe what you want in plain language. Knowing how to code helps you understand the generated code, but it isn't required to use it.
Can I connect my own domain?
Yes, but it requires a paid plan (Pro or higher); the free plan only lets you use Lovable's free subdomain.
What happens to the code it generates?
It syncs automatically to a GitHub repository that you own: the code is yours, and you can export or modify it outside Lovable at any time.
Based on lovable.dev/guides and official Lovable documentation