Lovable questions, answered
260 answers to the questions Lovable builders actually ask, each one checked against the official docs and dated so you know how current it is.
Getting Started
20 answersWhat Lovable is, what it can build, credits, ownership and your first project.
- What is Lovable?Lovable is an AI app builder: you describe the website or app you want in plain English and it writes and runs the real code for you, in the browser.
- How does Lovable work?You send a prompt, Lovable plans and writes real code files, runs the project, and shows you a live preview — repeating that loop for every change you ask for.
- Is Lovable good for beginners?Yes — beginners can ship a real website on day one, as long as they build in small steps and accept a learning curve once databases, logins and payments enter the picture.
- Do I need to know how to code to use Lovable?No. You can build and publish a working site without writing a line of code — but understanding a few concepts (components, databases, permissions) makes you dramatically more effective.
- What can I build with Lovable?Anything that runs as a web app: marketing sites, SaaS products, dashboards, CRMs, booking systems, directories, internal tools, AI apps and lightweight ecommerce.
- Can Lovable build a complete website?Yes — a complete, publishable multi-page website with forms, content, SEO metadata and a custom domain is well within scope.
- Can Lovable build a SaaS app?Yes. Accounts, per-user data, roles, dashboards and Stripe billing are all standard Lovable territory — but build them one layer at a time, not in one prompt.
- Can Lovable build an ecommerce website?Yes for small, focused stores — a handful of products, Stripe checkout and order records. For large catalogues, put Shopify or a commerce platform behind it instead.
- Can Lovable build a mobile app?Lovable builds web apps, not native App Store binaries. You get an excellent mobile-friendly web app, and you can wrap it with Capacitor if you truly need a store listing.
- How do I start a new project in Lovable?Open Lovable, describe the project in your first prompt, and it scaffolds a running app immediately — then refine it prompt by prompt.
- What should I put in my first Lovable prompt?Say what the product is, who it is for, which pages it needs, and how it should feel — then stop. Detail on one page beats a shopping list of twelve features.
- How detailed should a Lovable prompt be?Detailed about the outcome, brief about the implementation. Roughly a short paragraph plus a few bullets per request — long enough to remove ambiguity, short enough to stay about one thing.
- Should I build my whole website with one prompt?No. One giant prompt gives you a thin version of everything. Build the design system and home page first, then add one page or feature per prompt.
- How do Lovable credits work?Credits are one shared balance that pays for building, hosting and Cloud usage, and AI features inside your app. Free plans get a small daily grant; paid plans add a monthly balance on top.
- Why is Lovable using so many credits?Usually because of rework: vague prompts, huge multi-part requests, and repeated back-and-forth fixing something that a clearer first prompt would have got right.
- What's the difference between Lovable Cloud and Supabase?Lovable Cloud is a Supabase backend that Lovable runs and manages for you. Connecting your own Supabase project means you own the account, the dashboard and the bill.
- Can I use Lovable without Lovable Cloud?Yes. If your site has no accounts, no stored data and no server-side secrets, you never need to turn Cloud on.
- Can I export my Lovable project?Yes. Sync the project to your own GitHub or GitLab repository, or download the codebase from the code editor. It is a standard project you can run anywhere.
- Do I own the code Lovable creates?Yes. Lovable's own terms state you own the projects you build, the customer data stored in them, and the AI output — subject to the underlying model providers' terms.
- Can I move a Lovable website somewhere else?Yes. Export the code to your own repository, deploy it on any host that runs the stack, and migrate the backend and secrets. Plan for a few hours, not a few minutes.
Prompting & Building
20 answersWriting prompts that work, feeding in designs, brand assets and structure.
- How do I write a good Lovable prompt?Describe one concrete outcome, give real content and constraints, and say what NOT to touch. Plan first for anything non-trivial, then build in small steps.
- How do I get Lovable to follow my design properly?Give Lovable concrete references — a screenshot, a site to draw from, exact colours and fonts — and store them in Project knowledge so every prompt is checked against the same design rules.
- How do I give Lovable a website to use as inspiration?Paste the site's URL in your prompt and describe which parts to borrow — layout, spacing, tone — Lovable can't literally browse and clone it, so be specific about what you want copied.
- How do I get Lovable to copy a design style without copying the website?Ask for the underlying pattern — layout, spacing, type scale — in your own words and colours, not the site's actual assets, text or exact visual identity.
- How do I upload images to Lovable?Attach images directly in the chat message box — Lovable can use them as design references or as assets to place in your app (e.g. a logo or product photo).
- How do I get Lovable to use my logo?Attach your logo file in chat and tell Lovable exactly where to place it (header, favicon, footer) — it won't guess sizing or position from the file alone.
- How do I give Lovable my brand colours?Give exact hex codes in your prompt or Project knowledge, name which role each colour plays (primary, accent, background), and ask Lovable to apply them via the Tailwind/shadcn theme, not one-off styles.
- How do I get Lovable to use a specific font?Name the exact font (e.g. from Google Fonts) and tell Lovable to load it and apply it across the theme, not just the current page.
- How do I make Lovable build one feature at a time?Ask for one clearly-scoped feature per prompt and confirm it works in Preview before moving on — bundling several features into one message makes failures harder to isolate and revert.
- How do I stop Lovable changing things I didn't ask it to change?State explicitly what must stay unchanged in the same prompt, keep requests narrow, and check the diff/preview after each change so unintended edits are caught immediately.
- How do I tell Lovable to only edit one section?Name the exact page, component or element (or select it via the preview toolbar) and explicitly say the rest of the app should stay unchanged.
- How do I get Lovable to plan a feature before building it?Switch to Plan mode and describe the feature there — Lovable will ask questions and lay out a structured plan for you to approve before any code is written.
- How do I get Lovable to review existing code before making changes?Ask Lovable directly, ideally in Plan mode, to look at the relevant files or feature first and summarise how it currently works before proposing any changes.
- How do I make Lovable ask me questions before building?Use Plan mode and explicitly ask Lovable to raise questions or ambiguities before building — it's designed to clarify requirements first rather than guess.
- How do I get better results from Lovable prompts?Be specific and concrete, use real content, plan before building complex features, work in small steps, and review each result in Preview before prompting again.
- Why does Lovable misunderstand my prompts?Usually the prompt is ambiguous, references something that doesn't exist yet, or bundles too many changes at once — narrow it, add references, and split it up.
- Should I use screenshots when prompting Lovable?Yes, for layout and visual matching — a screenshot removes ambiguity that words leave open, especially for spacing, alignment and component styling.
- How do I make Lovable match a screenshot?Attach the screenshot, say precisely what to match (layout, spacing, colours, all of it), and iterate with follow-up prompts comparing Preview against the image side by side.
- How do I undo a bad Lovable change?Open Version history and revert to the version saved right before the bad change — every change Lovable makes is auto-saved as a version, so you can step back without losing later unrelated work.
- How do I safely make large changes to a Lovable project?Plan the change first, bookmark a known-good version before starting, break it into small ordered steps, and check Preview between each step so you can revert cleanly if one goes wrong.
Design & Mobile
20 answersLayout, typography, responsive behaviour and making a build look intentional.
- How do I make my Lovable website look less AI-generated?Set a real colour palette, a font pairing and spacing scale up front, then ask Lovable to remove generic gradients, stock-photo hero clichés and default shadcn styling so the site reads as bespoke.
- How do I improve the design of a Lovable website?Audit one page at a time in Preview, fix typography/colour/spacing consistency first, then use the preview toolbar to select and adjust individual elements rather than re-prompting the whole page.
- How do I make my Lovable website look professional?Professional usually means restrained: a small consistent palette, two fonts, generous whitespace, real content instead of placeholders, and working links — not extra visual effects.
- How do I fix spacing problems in Lovable?Point Lovable at specific sections with exact spacing values (in Tailwind units or pixels) rather than saying "fix the spacing" — vague requests get vague, inconsistent results.
- How do I fix inconsistent fonts?Tell Lovable exactly which two fonts to use for headings and body text, add it to Project knowledge, and ask it to sweep the whole app and replace any font that doesn't match.
- How do I make my Lovable website mobile-friendly?Lovable's Tailwind output is responsive by default, but you still need to explicitly review and prompt fixes at mobile breakpoints — ask Lovable to check every page in a mobile viewport and fix overflow, tap targets and stacking order.
- Why does my Lovable website look different on mobile?Tailwind renders layouts differently at each breakpoint by design, but if the difference looks broken rather than intentional, it usually means an element uses a fixed width, an unhandled grid, or missing responsive classes for that breakpoint.
- How do I fix horizontal scrolling on mobile?Horizontal scroll on mobile almost always comes from one element wider than the viewport — a fixed-width box, an un-wrapped table, or negative margins — ask Lovable to find and fix the specific overflowing element rather than the whole page.
- How do I fix buttons overflowing on mobile?Set buttons to full width or allow text wrapping below a breakpoint, and shorten long button labels for mobile — ask Lovable to make buttons responsive rather than fixed-width.
- How do I fix tables on mobile?Wrap the table in a horizontally scrollable container, or ask Lovable to convert it into stacked cards on mobile — plain HTML tables rarely fit a phone screen without one of these changes.
- How do I make a mobile menu in Lovable?Ask Lovable to add a hamburger menu using shadcn/ui's Sheet or Drawer component that opens a slide-out nav below the tablet breakpoint, keeping the existing desktop nav bar unchanged above it.
- How do I make sections full width?Remove the container's max-width constraint for that section and make its background span the full viewport width, while keeping the inner content in a centred, max-width column for readability.
- How do I add animations?Ask for specific, subtle animations (fade-in on scroll, hover states, a smooth page transition) rather than "add animations" generally — Lovable can use Tailwind transitions or a library like Framer Motion depending on what you need.
- How do I remove unnecessary animations?List the specific animations that feel excessive (bounce, spin, auto-sliding carousels, delayed fade-ins) and ask Lovable to remove or simplify just those, rather than stripping all motion from the site.
- How do I make a sticky header?Ask Lovable to make the header `fixed` or `sticky` at the top with a defined z-index, and add top padding to the page content equal to the header's height so it isn't hidden underneath.
- How do I make a sticky mobile CTA?Ask Lovable to add a fixed bottom bar on mobile only, containing the single most important call-to-action, and make sure it doesn't overlap other fixed elements or block form fields near the bottom of the screen.
- How do I create popups or lightboxes?Ask Lovable to use shadcn/ui's Dialog component for modal popups (confirmations, forms, image lightboxes) and specify the trigger, content and close behaviour clearly rather than describing it as a generic "popup".
- How do I create tabs or accordions?Ask Lovable to use shadcn/ui's Tabs or Accordion component for the specific content you're organising (e.g. FAQ, pricing feature comparison) — these are standard, accessible components already available in the library.
- How do I add dark mode?Ask Lovable to add a theme toggle using Tailwind's dark mode classes and shadcn/ui's theming support, then check every page and component — including third-party embeds — for readable contrast in both themes.
- How do I improve accessibility?Ask Lovable to check colour contrast, add alt text to images, ensure keyboard navigation works, and use semantic HTML/ARIA labels — these cover most common accessibility gaps in generated sites without needing a full audit tool.
Forms & Email
15 answersContact forms, storing submissions, notifications and deliverability.
- How do I create a contact form in Lovable?Describe the form fields you want in chat (name, email, message) and ask Lovable to build a contact form; it will generate the React form with validation and wire it to a submit handler.
- Where do Lovable form submissions go?Nowhere, by default — a form only exists on the front end until you connect a destination: a database table (Lovable Cloud/Supabase) and/or an outgoing email via an integration like Resend.
- How do I save form submissions to a database?Connect Lovable Cloud (or your own Supabase project), then ask Lovable to create a table for submissions and wire the form's submit handler to insert a row into it, with row-level security limiting who can read the data.
- How do I email form submissions to myself?Connect an email integration (Resend is the standard option), then ask Lovable to trigger a server-side function that emails you the form data whenever it's submitted.
- Why isn't my Lovable contact form working?Check, in order: whether a submit handler is actually wired up, whether a backend (Lovable Cloud/Supabase) is connected if you're saving data, whether client-side validation is blocking submission, and the browser console for errors.
- Why aren't form emails being delivered?Most delivery failures trace back to an unverified sending domain, spam-folder filtering, or a server function that's failing silently — check your email provider's logs (e.g. Resend's dashboard) first.
- How do I stop spam form submissions?Add a honeypot field, rate-limit submissions server-side, and validate inputs strictly; for public-facing high-traffic forms, add a CAPTCHA on top.
- How do I add CAPTCHA to Lovable?Ask Lovable to integrate a CAPTCHA provider such as Google reCAPTCHA or Cloudflare Turnstile, including the site key on the front end and server-side verification of the token before accepting the submission.
- How do I validate form fields?Describe the exact rules per field (required, format, length, matching) to Lovable and ask for both client-side validation for instant feedback and server-side validation before the data is saved.
- How do I create a multi-step form?Describe the steps and what data each collects, and ask Lovable to build a wizard-style form that keeps state across steps and only submits everything on the final step.
- How do I upload files through a form?Use Lovable Cloud's (or Supabase's) storage buckets: ask Lovable to add a file input, restrict file type and size, and upload to a storage bucket with access rules controlling who can read the file later.
- How do I create an enquiry management dashboard?Ask Lovable to build an admin-only page that lists submissions from your database table, with search, status filters and the ability to mark enquiries as handled — protected by authentication and row-level security.
- How do I send automatic confirmation emails?Ask Lovable to trigger a server-side function after a successful form submission (or sign-up) that sends a confirmation email via an integration like Resend, using a template you describe.
- How do I connect Resend to Lovable?Open the Resend integration in Lovable (or ask in chat to connect Resend), authorise your Resend account, then prompt Lovable to use it for whatever emails you need sent.
- How do I use my own email domain?Verify your domain with your email provider (Resend or similar) by adding the SPF, DKIM and DMARC DNS records it gives you, then ask Lovable to send from an address on that domain instead of a shared or test address.
Cloud, Database & Supabase
20 answersTables, queries, RLS, storage and how Lovable Cloud relates to Supabase.
- What is Lovable Cloud?Lovable Cloud is a Supabase backend (Postgres database, authentication, storage, edge functions) that Lovable provisions and manages for your project automatically, with no separate account or dashboard needed.
- When should I use Lovable Cloud?Use Lovable Cloud for most new projects needing a backend — it's the fastest path with no separate account; connect your own Supabase project instead if you already have one, need direct dashboard access, or must integrate with existing Supabase infrastructure.
- How do I connect Supabase to Lovable?In your Lovable project, open the Supabase integration and authorise Lovable to connect to an existing Supabase project (or create a new one), then Lovable can read and write to it the same way it does with Lovable Cloud.
- How do I create a database in Lovable?Ask Lovable to set up Lovable Cloud (or connect your own Supabase project) and describe the tables you need — Lovable provisions the Postgres database and creates the tables from your description.
- How do I create database tables?Describe the table's purpose and fields in plain language to Lovable — including which fields are required, their types, and any relationships to other tables — and Lovable generates the table with appropriate row-level security policies.
- How do I view my database data?Open the Cloud tab (or ask Lovable) to browse tables, edit rows and run SQL directly inside your project — no separate Supabase login needed.
- Why isn't Lovable saving data?Most commonly this is a missing or misconfigured RLS policy blocking the insert/update, an unconnected database, or a form that never calls the backend at all.
- Why is Supabase returning a 403 error?A 403 means Row Level Security blocked the request — the current user's role doesn't match any policy allowing that read or write on that table.
- What is Row Level Security (RLS)?RLS is a Postgres feature that restricts which rows a query can see or change, enforced per-row on the database itself rather than trusted to your app's code.
- Do I need RLS on my Lovable app?Yes, for almost any app with user data, private content or logged-in users — without RLS, anyone can read or write any row via the database's public API.
- How do I fix RLS errors?Identify which operation and role is being blocked, then ask Lovable to add or correct the specific policy for that table rather than disabling RLS.
- Why can users see other users' data?Almost always a missing or too-permissive RLS policy — either RLS isn't enabled on the table, or a policy allows reading rows regardless of who owns them.
- How do I safely store API keys?Store keys as secrets in your backend (Lovable Cloud/Supabase) and call the third-party API from a server/edge function — never put keys in front-end code.
- How do I use environment variables?Use `VITE_`-prefixed variables only for non-sensitive, public values baked into the front-end build; use Secrets for anything sensitive that a server/edge function needs.
- What are Supabase Edge Functions?Edge Functions are small serverless backend functions that run outside the browser — used for anything requiring a secret key, a third-party call, or logic that shouldn't be trusted to the client.
- When should I use an Edge Function?Use one whenever your app needs a secret key, must call a third-party service, or needs logic that shouldn't be trusted to run in the user's browser.
- How do I upload and store files?Ask Lovable to add file uploads and it will wire up storage in Lovable Cloud (or your connected Supabase project), including an upload UI and access policies for the files.
- How do I back up my Lovable database?Lovable Cloud stores backups you can restore from directly in the Database screen; for extra safety, also ask Lovable to export your data periodically.
- How do I migrate a database?Describe the schema change you want in chat and let Lovable write and apply the migration — it handles new tables, columns and RLS policy updates together.
- Can I move from Lovable Cloud to Supabase?Yes — Lovable Cloud is a Supabase backend under the hood, and Lovable supports connecting your own Supabase project instead, though moving existing data across takes an export/import step.
Login & User Accounts
15 answersSign-in, sessions, protected pages, roles and admin access.
- How do I add login to Lovable?Ask Lovable to add authentication — it enables Lovable Cloud (if not already on), then generates sign-up/login pages and wires them to email, Google, or other providers.
- How do I add user registration?Ask Lovable to add sign-up with the fields and verification behaviour you want — it builds the form, creates the user in Lovable Cloud's auth system, and can store extra profile details in your database.
- How do I add Google login?Ask Lovable to add Google sign-in — it can use Lovable's managed Google OAuth for a quick setup, or your own Google Cloud OAuth credentials if you need custom branding or scopes.
- How do I add password reset?Ask Lovable to add a "forgot password" flow — it uses Lovable Cloud's authentication to email a reset link and lets the user set a new password.
- Why isn't my login working?Check the browser console for the actual error first — common causes are unconfirmed email, a redirect URL mismatch, RLS blocking the post-login profile read, or a provider (like Google) misconfigured for the current domain.
- Why does my app keep redirecting to login?This is almost always a session or route-guard bug: either the auth session isn't persisting, or a protected route checks auth state before it's loaded, so it bounces back to login even when signed in.
- Why are verification emails not arriving?Usually the email lands in spam, the sending rate limit on Lovable Cloud's default mailer has been hit, or you haven't connected a proper email provider yet.
- How do I restrict pages to logged-in users?Wrap the routes in a protected-route component that checks the current auth session and redirects signed-out users to login, and back this up with row-level security on any data those pages fetch.
- How do I create admin users?Add a `user_roles` table with an `admin` role, assign it to the specific user's ID, and check that role server-side (in RLS policies and any admin-only functions) rather than trusting a front-end flag.
- How do I create different user roles?Store roles in a dedicated `user_roles` table (never a column on the user's profile), and use a security-definer function to check roles inside RLS policies and route guards.
- How do I build an admin dashboard?Ask Lovable to build a role-gated route that lists and manages your data (users, orders, content), backed by RLS policies that only let accounts with the `admin` role query the underlying tables.
- How do I prevent normal users accessing admin pages?Guard the admin route with a check against the user's role from your `user_roles` table (not a front-end-only flag), and mirror that same check in RLS policies on any data the admin page loads.
- How do I delete a user?Ask Lovable to add an admin action that deletes both the user's auth account and their related data (profile rows, uploads, etc.), since removing one without the other leaves orphaned records or broken references.
- How do I let users edit their profiles?Add a profile form bound to a `profiles` table row keyed by the user's ID, with an RLS policy that only lets each user update their own row, not anyone else's.
- How do I test authentication properly?Test with real, separate accounts in a private browser window for each role (signed-out, normal user, admin), checking both the UI and that the underlying API/RLS actually blocks what it should — not just what the interface shows.
Domains & Publishing
17 answersPublishing, custom domains, DNS, redirects and preview vs live differences.
- How do I publish a Lovable website?Click Publish in the top-right of the Lovable editor; it deploys your current version to a live `*.lovable.app` URL (or your connected custom domain) in under a minute.
- How do I connect my own domain to Lovable?In Project settings, go to Domains, add your domain, and create the DNS records Lovable gives you (usually an A record or CNAME) at your domain registrar or DNS host — then wait for verification, which can take anywhere from minutes to a few hours.
- Can I use a .com.au domain with Lovable?Yes — Lovable's custom domain feature works with any domain you own, including .com.au, as long as you can add DNS records at wherever the domain's nameservers point.
- How do I connect a Cloudflare domain to Lovable?Add the DNS records Lovable gives you in Cloudflare's DNS panel, and set the proxy status to 'DNS only' (grey cloud) rather than proxied (orange cloud) so Lovable can verify and serve the domain correctly.
- What DNS records does Lovable need?Lovable shows the exact records to add when you connect a domain — typically an A record for the root/apex domain and a CNAME for `www` (or a subdomain), plus any verification record it asks for.
- Why isn't my custom domain connecting?Most failures come down to DNS records that don't exactly match what Lovable asked for, edits made in the wrong place, or not waiting long enough for DNS to propagate — check the records first, then give it time.
- How long does a Lovable domain take to connect?Usually a few minutes to a couple of hours once the DNS records are correctly added, but full global DNS propagation can technically take up to 48 hours in rare cases.
- Why does my domain show a 404 or 403 error?A 404/403 on a connected domain usually means DNS is pointed correctly but the app hasn't been published, the domain is linked to the wrong project, or the SSL/routing hasn't finished setting up yet — it's a different problem from DNS not resolving at all.
- How do I connect www and non-www versions?Add DNS records for both the root domain and the `www` subdomain in Lovable's Domains panel, then choose one as your primary — Lovable typically redirects the other to it automatically.
- How do I choose my primary domain?In Project settings → Domains, set which connected domain (e.g. root vs `www`, or which of several domains) is primary; Lovable serves and redirects other connected domains to that one.
- Does Lovable provide SSL?Yes. Every Lovable-published site gets HTTPS automatically, including the free lovable.app subdomain and any custom domain you connect through Lovable.
- Why does my published site look different from preview?Usually it's a stale cache — your browser or a CDN is showing an older published version. Hard-refresh, check you actually clicked Publish, and confirm you're viewing the live URL, not a cached preview link.
- Why aren't my latest changes appearing live?Most likely you haven't clicked Publish since the last edit, or you (or a viewer's browser/CDN) are looking at a cached copy of the old page.
- How do I unpublish a Lovable project?Open the Publish panel in your project and choose the unpublish/take-down option — this removes the live site while keeping your project and its code intact in Lovable.
- How do I change the favicon?Ask Lovable in chat to update the favicon, and upload or link the image you want — Lovable will swap the icon file and reference it in the page head for you.
- How do I change the website title?Ask Lovable to change the page title, or edit the <title> tag in index.html directly in the Code editor — this is the text shown in the browser tab and search results.
- How do I change the social sharing image?Ask Lovable to update the Open Graph image, or edit the og:image meta tag in your page head and upload the image asset — this controls the preview card shown when your link is shared on social platforms.
SEO & Google
23 answersIndexing, metadata, sitemaps, structured data and Search Console.
- Is Lovable good for SEO?Lovable apps can rank well — Lovable now runs an SEO/AI-search review and lets you set titles, descriptions, sitemaps and structured data — but you still have to do the SEO work; it isn't automatic just because the site is built with Lovable.
- How do I SEO a Lovable website?Set unique titles and meta descriptions per page, add a sitemap.xml and robots.txt, use Open Graph tags, add alt text to images, connect a custom domain, and submit your sitemap to Google Search Console.
- Does Lovable automatically create a sitemap?No — a sitemap.xml isn't generated automatically for a typical project. You need to ask Lovable to add one, or it may be included as part of a dedicated SEO setup/review feature on newer projects.
- How do I create a sitemap.xml?Ask Lovable to generate a sitemap.xml listing your public routes and place it in the public folder, or ask for a dynamically generated one if your pages come from a database.
- How do I create robots.txt?Ask Lovable to add a robots.txt file in the public folder that allows crawling of public pages, blocks private/admin routes, and points to your sitemap.xml.
- How do I change meta titles?Ask Lovable to set a unique <title> tag per page (or edit it directly in the head/layout code) — each important page should have its own descriptive, keyword-relevant title rather than sharing one site-wide title.
- How do I change meta descriptions?Ask Lovable to set a unique meta description per page — a one to two sentence summary in the <meta name="description"> tag that Google may show under your title in search results.
- How do I add canonical URLs?Ask Lovable to add a <link rel="canonical"> tag to each page pointing to its preferred URL — this tells search engines which version to index when the same content is reachable at more than one address.
- How do I add schema markup?Ask Lovable to add JSON-LD structured data (schema.org markup) relevant to your page type — e.g. Organization, Product, Article or FAQ — inserted as a script tag in the page head.
- How do I add Open Graph metadata?Ask Lovable to add Open Graph tags (og:title, og:description, og:image, og:url) to your page head — these control how your links look when shared on social platforms and in some chat apps.
- How do I add alt text to images?Ask Lovable to add descriptive alt attributes to every meaningful image in your app — describe what the image actually shows or conveys, not just its filename.
- How do I connect Google Search Console?Use Lovable's Google Search Console integration to verify your domain and manage search data directly from chat, or verify manually by adding the DNS/HTML verification record Google provides.
- How do I submit my Lovable sitemap to Google?Verify your domain in Google Search Console (directly from Lovable's integration or manually), then submit your sitemap.xml URL under the Sitemaps section so Google knows to crawl it.
- Why isn't my Lovable website appearing on Google?Usually because the site is new and not yet crawled, it isn't published to a real domain, or it lacks basic metadata search engines need to index and rank it.
- How long does Google take to index a Lovable website?There's no fixed timeline — often a few days to a few weeks for a new domain, faster if you submit a sitemap in Google Search Console and the site has clean metadata.
- How do I stop a Lovable page being indexed?Ask Lovable to add a noindex meta tag to that specific page, and optionally disallow it in robots.txt — don't block the whole domain by mistake.
- How do I improve Lovable SEO?Use Lovable's built-in SEO & AI search review to fix titles, meta tags, sitemap and structured data, connect a custom domain, and keep writing real unique content on each page.
- How do I improve Lovable AEO?AEO (answer engine optimisation) means writing clear, directly-quotable answers and structured content so AI tools like ChatGPT and Perplexity can find and cite your site — Lovable's SEO & AI search review covers this alongside traditional SEO.
- How do I get a Lovable website appearing in ChatGPT?There's no way to pay or submit for guaranteed inclusion — publish on a real domain with clear, factual, well-structured content, and let AI crawlers index it the same way search engines do.
- What is llms.txt and does my Lovable site need it?llms.txt is a proposed plain-text file at your site's root that summarises its structure and key pages for AI systems, similar to robots.txt for crawlers — useful for content-heavy sites, optional for most small business sites.
- How do I run an SEO audit in Lovable?Use the built-in SEO and AI search review from within your project to scan for missing titles, meta tags, sitemap, and other issues, then ask Lovable to fix each one it finds.
- How do I use Lovable's Semrush integration?Connect Semrush from your project's Integrations to pull live keyword research, domain analytics and backlink data into Lovable, either to inform SEO decisions or to embed that data inside the app you're building.
- How do I find keywords in Lovable?Use Lovable's SEO and AI search feature, which pulls live Semrush keyword data, to research search volume and competition for terms relevant to your site before you write page copy.
GitHub & Code
12 answersSyncing to GitHub, editing code, branches and working outside Lovable.
- How do I connect Lovable to GitHub?Open your project's Settings, go to the GitHub/Git sync integration, authorise Lovable's GitHub app, and choose or create the repository to sync with — Lovable then keeps code in sync both ways automatically.
- Should I connect my Lovable project to GitHub?Yes for most real projects — it gives you a free, portable code backup and lets developers or other tools work on the code, with no real downside beyond one extra setup step.
- When should I connect GitHub?Connect it as soon as the project is more than a throwaway experiment — ideally at the start, and definitely before involving another developer, going to production, or relying on the app for a real business.
- Does Lovable automatically sync with GitHub?Yes — once connected, Git sync is automatic and two-way: changes made in Lovable push to GitHub, and commits pushed to GitHub pull back into Lovable, with no manual export step required.
- Why isn't GitHub syncing with Lovable?Usually a permissions/authorisation issue, a disconnected integration, or a conflicting edit on both sides at once — reconnect the GitHub app and check recent commits on both ends.
- Can I edit Lovable code directly in GitHub?Yes — once Git sync is connected, you (or a developer) can edit code directly in GitHub or your own IDE, and those changes sync back into Lovable automatically.
- Will editing GitHub break my Lovable project?Not inherently — Git sync is designed to handle two-way edits, but structural mistakes, conflicting simultaneous edits, or breaking the build can cause problems that show up back in Lovable.
- How do I restore an older version?Open Version history in your Lovable project, find the version you want, and revert to it — this restores the project's code (and, if bookmarked, is easy to find again) without needing GitHub.
- How do I create a backup before making changes?Bookmark the current Version history entry before you start, and connect GitHub if you haven't already — together they give you an in-app safety net and an independent copy of the code outside Lovable.
- Can developers work on Lovable code outside Lovable?Yes — once your project is synced to GitHub, developers can clone it, edit in their own IDE, run their own build/test tools, and push changes back, all of which sync into Lovable automatically.
- Can I use Cursor with Lovable?Yes. Use Git sync to push your Lovable project to GitHub, then clone that repo and open it in Cursor for local edits, which sync back to Lovable.
- Can I host Lovable code somewhere else?Yes. You can download your project's code or sync it to GitHub via Git sync, then deploy it to any host that supports a Node/Vite React app (Vercel, Netlify, your own server, and so on).
Integrations & APIs
18 answersStripe, email, third-party APIs, keys and webhooks.
- How do I connect an API to Lovable?Describe the API and what you want it to do in Chat; Lovable will typically wire the call through a server function (Edge Function) so any API key stays off the client.
- How do I connect Stripe?Use Lovable's built-in Payments feature where available; for anything it doesn't cover, ask Lovable to wire Stripe through a server function that keeps your secret key off the client.
- How do I accept payments?Ask Lovable to add its built-in Payments feature (backed by Stripe) for checkout; it handles one-time payments and subscriptions without you managing raw API keys in the UI.
- How do I create subscriptions?Set up recurring prices in Stripe, then ask Lovable to create checkout for those prices and store each user's subscription status in your database so you can gate features accordingly.
- How do I connect OpenAI?For most cases, use Lovable AI (the built-in AI Gateway) so users don't need their own key; if you specifically need OpenAI, ask Lovable to store your API key as a secret and call it from a server function.
- How do I connect Google Maps?Get a Google Maps API key restricted to your domain, store it as a secret, and ask Lovable to embed the map component using that key server-side where possible.
- How do I connect Google Analytics?Ask Lovable to add your Google Analytics measurement ID as a script/tag in the site's head, or install it via Google Tag Manager for more flexibility.
- How do I install Google Tag Manager?Ask Lovable to add your GTM container snippet to the site's shared head and body, then manage individual tags (analytics, ads, pixels) from within Tag Manager itself.
- How do I connect Meta Pixel?Ask Lovable to add your Meta Pixel ID as a script in the site's shared head, and fire a PageView (or custom) event on each route change since Lovable apps are single-page apps.
- How do I add a booking system?For simple scheduling, embed an existing tool like Calendly; for a fully custom booking flow, ask Lovable to build a bookings table with availability logic backed by Lovable Cloud.
- How do I embed Calendly?Ask Lovable to embed your Calendly link using Calendly's inline widget or popup script on the relevant page.
- How do I connect Shopify?Connect via Shopify's Storefront API (for product/catalogue data) or link out to an existing Shopify checkout; Lovable doesn't replace Shopify's backend, it calls into it.
- How do I connect an external CRM?Ask Lovable to build a server function that sends or fetches records via your CRM's REST API (HubSpot, Salesforce, Pipedrive, etc.), using an API key stored as a secret.
- How do I connect an email marketing platform?Ask Lovable to send new subscribers or events to your email platform's API (Mailchimp, ConvertKit, Klaviyo, etc.) via a server function using an API key stored as a secret.
- How do I use webhooks?Webhooks let external services notify your Lovable app when something happens; ask Lovable to create a server function URL as the webhook endpoint, and configure that URL in the third-party service.
- How do I receive webhook data?Ask Lovable for a server function that accepts incoming POST requests, verifies the sender where possible, then stores the payload in your database.
- How do I securely call third-party APIs?Keep every API key and secret server-side in a Lovable Cloud/Supabase server function, never in front-end code, and have your UI call that function instead of the third-party API directly.
- Why is my API working in preview but not production?This is usually a missing secret, environment mismatch, or a domain restriction that only applies once the app is published — check that every secret and allowed-domain setting has been applied to production, not just preview.
Errors & Troubleshooting
30 answersExact error messages, blank screens, failed builds and loops.
- Why is Lovable not working?Usually it's not Lovable itself but one specific failure — a build error, a stuck message, a Supabase hiccup, or a browser issue. Diagnose in order rather than guessing.
- Why is my Lovable project stuck?A stuck project usually means a message is still processing, a build failed silently, or you're in a fix loop. Check the chat status, the build/error banner, and version history before assuming it's frozen.
- Why is Lovable chat stuck loading?Chat usually gets stuck loading due to a network blip, a very large/complex request, or a backend timeout. Refresh first, then check the console before resending the same prompt.
- Why is my Lovable preview blank?A blank preview almost always means a JavaScript error is stopping the app from rendering. Open the browser console to find the exact error, then ask Lovable to fix it.
- How do I fix a white screen in Lovable?A white screen is a rendering crash — check the browser console for the error, paste it back to Lovable verbatim, and revert to a working version if repeated fixes don't clear it.
- Why did Lovable break my website?Something in a recent prompt likely had a side effect on shared code, styles or data. Check version history to see exactly what changed, then decide whether to revert or fix forward.
- How do I undo Lovable changes?Open Version history, find the last version before things went wrong, and revert to it — this restores the whole project to that exact state.
- How do I fix a Lovable build error?Read the exact error message and file it points to, paste it back to Lovable, and let it fix that specific error rather than describing the symptom vaguely.
- Why does Lovable keep saying "try to fix"?That prompt means Lovable's own fix attempt didn't fully resolve the error and it's suggesting another pass. If it repeats several times, stop and change approach rather than keep clicking it.
- Why can't Lovable fix an error?Usually because the prompt only describes the symptom, not the actual error text, or the root cause is outside the code Lovable can see (a third-party service, secret, or data issue).
- How do I stop Lovable getting stuck in a fix loop?Stop clicking automatic fixes, switch to Plan mode to find the actual root cause, and if that fails, revert to the last stable version instead of continuing to patch.
- Why did fixing one thing break another?Shared code — layouts, components, hooks, RLS policies — often affects more than the page you're focused on, so a targeted fix can have side effects elsewhere. Scope prompts narrowly and check related pages after each fix.
- Why does my app work in preview but not when published?Preview and the published site can differ due to environment variables, caching, or build-time settings that only apply to one environment. Check environment/secret configuration and hard-refresh the published URL before assuming it's a Lovable bug.
- Why does my app work for me but not other users?This is almost always a permissions or role issue — check Row-Level Security policies and the user_roles table rather than the front-end code, since it's usually about who's allowed to read/write data, not a bug.
- Why am I getting a 403 error?A 403 means the request was understood but denied — almost always a permissions or Row-Level Security issue rather than a bug in the request itself. Check who's making the request and what policy should allow it.
- Why am I getting a 404 error?A 404 means the thing being requested doesn't exist at that path — check for a broken route, a renamed page, a missing database row, or a wrong API endpoint.
- Why am I getting "Failed to Fetch"?"Failed to fetch" means the browser couldn't complete a network request at all — usually CORS, a down endpoint, a missing/invalid API key, or no internet connection, rather than a code logic error.
- Why am I getting CORS errors?CORS errors happen when your app's domain tries to call an API that hasn't explicitly allowed it. Fix it on the server side — either by adding your domain to the API's allow-list or by routing the call through a server function.
- Why are environment variables missing?Environment variables/secrets are usually missing because they were set for one environment (preview) but not another (production), never entered at all, or referenced with the wrong name in code. Ask Lovable to check what's configured rather than guessing.
- Why has Supabase stopped connecting?Usually an expired/rotated key, a paused free-tier project, an RLS policy change, or a genuine outage. Check the connection status and error message in Lovable before assuming your code broke.
- Why is authentication suddenly broken?Auth usually breaks after a schema change, an RLS policy edit, or an expired/misconfigured provider setting — check Logs first, then ask Lovable to diagnose before fixing.
- Why did my database stop working?A stopped database usually means a broken RLS policy, a failed migration, or (rarely) a paused/disconnected Supabase project — check Logs and ask Lovable to diagnose before changing anything.
- Why is my custom domain offline?Custom domains usually go offline because of a missing or changed DNS record, a certificate that hasn't issued yet, or the registrar's records pointing somewhere else — recheck the domain settings and your DNS provider.
- Why won't my Lovable project publish?Publishing usually fails because of a build error, an unresolved dependency, or a backend function that errors at build time — check the build log Lovable shows and fix that specific error first.
- Why are Lovable builds failing?Builds usually fail from a syntax/type error, a broken import, or a server function that errors during the build's checks — copy the exact error into your next prompt rather than asking Lovable to guess.
- Why aren't my changes showing?Usually a stale preview cache, an unsaved/unpublished change, or you're looking at the live site instead of Preview — hard-refresh, confirm the chat finished, and republish if needed.
- How do I read Lovable console errors?Open the browser console or Lovable's Logs panel, find the first error (later ones are often side effects), and paste the exact message and file/line into your next prompt.
- How do I debug a Lovable project?Reproduce the bug, gather the exact error from the console or Logs, ask Lovable to diagnose in Plan mode before changing code, then request the smallest possible fix.
- How do I ask Lovable to diagnose an error without changing anything?Use Plan mode, or explicitly tell Lovable in Chat to investigate and explain the cause without editing code — this stops it from making speculative changes while you're still working out what's wrong.
- How do I get Lovable to make the smallest possible fix?Describe the exact symptom and error, explicitly ask for the minimal targeted change, and tell Lovable not to refactor or touch unrelated files.
Speed & Performance
16 answersLoad time, images, Core Web Vitals and slow queries.
- Why is my Lovable website slow?Slowness is usually caused by large unoptimised images, too much data fetched at once, or heavy client-side rendering — profile it with Lighthouse/DevTools before asking Lovable to fix anything.
- How do I speed up a Lovable website?Compress and lazy-load images, fetch only the data each page needs, remove unused dependencies, and ask Lovable to run a performance/codebase audit to find the highest-impact fixes.
- Why does my Lovable app get slower as I add features?Each new feature can add its own data fetches, dependencies, and re-renders that compound over time — without periodic clean-up, an app accumulates weight even if each individual change seems small.
- How do I improve Lighthouse scores?Run Lighthouse to find your worst-scoring category, fix the top 2-3 flagged issues (usually images, unused JavaScript, or render-blocking resources), and re-run it to confirm before moving on.
- How do I improve Core Web Vitals?Focus on the three metrics Google measures — LCP (loading), INP (interactivity), and CLS (visual stability) — and fix the specific one flagged as poor, usually starting with images for LCP.
- How do I improve LCP?Largest Contentful Paint is almost always slowed by an oversized hero image or a render-blocking resource — compress/preload the largest above-the-fold element and defer everything not needed for first paint.
- Why are images loading slowly?Images usually load slowly because they're uploaded at full camera/design resolution, in an uncompressed format, and without lazy-loading or a CDN — the fix is compression, correct sizing, and modern formats.
- How do I optimise images?Resize images to their actual display size, compress them, convert to WebP/AVIF where practical, and lazy-load anything below the fold — ask Lovable to apply this across the project, not just one page.
- How do I lazy-load images?Ask Lovable to add native lazy-loading to images below the fold while keeping the hero/first-visible image loading eagerly, so visitors aren't downloading offscreen images before they're needed.
- Why is my database making so many requests?Usually a component is re-fetching data on every render, a page is running the same query multiple times, or you're fetching entire tables instead of what's actually needed — ask Lovable to audit data-fetching patterns.
- How do I reduce unnecessary database calls?Fetch only what a page needs, cache results, batch requests, and let Postgres do filtering instead of pulling whole tables into the client.
- Why is my dashboard slow?Dashboards are usually slow because they run several unoptimised queries at once, re-render on every state change, or load large charts and images without lazy loading.
- Why does my app become slow with more users?Slowdowns under load usually mean missing database indexes, no rate limiting, or queries that scale linearly with row count instead of being paginated.
- How do I find unnecessary React renders?Use React DevTools' Profiler and the 'Highlight updates' setting to see which components re-render too often, then fix unstable props, missing memoisation, or state stored too high in the tree.
- How do I remove unused code?Ask Lovable to search for unused components, imports and dependencies, or run a tool like ts-prune/depcheck via the terminal, then remove what's confirmed unused and re-test.
- How do I audit a Lovable project's performance?Combine a browser Network/Performance trace, a React DevTools profile, and a query review of your Supabase schema — then ask Lovable to fix the specific issues found rather than 'optimise everything'.
Security
19 answersKeys, permissions, data exposure and hardening a build before launch.
- Are Lovable websites secure?Lovable includes built-in security scanning and API-key protection, but real security also depends on you setting up row-level security and role checks correctly — it isn't automatic just because you used Lovable.
- How do I run a security audit on Lovable?Open your project's Security view in Lovable to see automated scan results, then ask Lovable in chat to review RLS policies, role storage, and any exposed secrets in detail.
- How do I secure a Lovable app before launch?Before launch, verify RLS on every table, move roles into a dedicated user_roles table, confirm no secrets sit in front-end code, and run Lovable's Security view scan.
- How do I check Supabase RLS?Ask Lovable to list every table and its row-level security status and policies in plain language — Lovable Cloud users don't have Supabase dashboard access, so this has to go through chat.
- Can users access my database?Only through the access rules you (or your row-level security policies) allow — Lovable Cloud's database isn't publicly browsable, but a table without RLS enabled is effectively open to anyone with your app's public key.
- Can users access other users' information?Only if your row-level security policies are missing or too permissive — with correct RLS, a query for 'my orders' can only ever return rows owned by the logged-in user, regardless of what the front end sends.
- How do I protect admin pages?Check the user's role server-side (in the database query or Edge Function) using a dedicated user_roles table — hiding an admin link in the navigation menu doesn't stop someone visiting the URL directly.
- How do I protect API keys?Never put API keys in front-end code — store them as secrets used only inside server functions (Edge Functions), where the browser never sees them.
- Where should secrets be stored?In your project's server-side secrets store, used only inside Edge Functions — never in front-end code, client-side environment variables, or committed to your Git repository.
- How do I secure Edge Functions?Verify the caller's identity and role inside the function itself, validate all input, use secrets rather than hard-coded keys, and don't assume the front end already checked permissions.
- How do I prevent database abuse?Combine row-level security with rate limiting on writes, input validation, and CAPTCHA or similar checks on public forms — RLS stops unauthorised reads/writes, but it doesn't stop a legitimate-looking user from hammering an endpoint.
- How do I rate-limit an API?Add per-user or per-IP request limits inside your Edge Function (or via a Postgres table tracking recent requests), since Lovable doesn't apply rate limiting to your custom endpoints automatically.
- How do I stop bots?Add a CAPTCHA (e.g. Cloudflare Turnstile) to public forms, validate inputs server-side, and rate-limit submissions — client-side-only checks like a hidden field are easy for real bots to bypass.
- How do I prevent spam registrations?Verify email addresses on sign-up, add a CAPTCHA to the registration form, rate-limit sign-up attempts per IP, and check the token server-side before creating an account.
- How do I check for exposed environment variables?Ask Lovable to search your codebase for hard-coded API keys and secrets in front-end files, then move anything sensitive into a server function or edge function.
- Is my Supabase anon key safe to expose?Yes. The Supabase anon key is meant to be public — it identifies your project, it does not grant access on its own. Access is controlled by row-level security (RLS) policies, not by hiding the key.
- How do I check a Lovable project for security vulnerabilities?Open the project's Security view (or the workspace Security center) to run Lovable's built-in scan for exposed secrets, missing RLS, and vulnerable dependencies, then ask Lovable to fix what it flags.
- What security checks should I do before launching?Run Lovable's Security scan, verify RLS on every table, confirm secrets are server-side, check auth flows and admin permissions, and re-test payments before you Publish.
- How do I make Lovable perform a security review without changing anything?Explicitly tell Lovable to run in read-only review mode — ask it to report findings only and not touch any code, then decide what to fix yourself.
Before Launch
15 answersThe checks worth doing before a Lovable project goes live.
- What should I check before launching a Lovable website?Run through security, forms, auth, payments, mobile display, browser compatibility, speed, SEO basics and broken links before you hit Publish.
- How do I test my Lovable app?Work through core user flows manually in Preview and on a published link, on desktop and mobile, as a logged-out user and as a normal account — not just as the builder.
- How do I test mobile devices?Open the published site on a real phone (or use your browser's device toolbar as a fallback) and check layout, tap targets, forms and navigation at common breakpoints.
- How do I test forms?Submit every form with valid, invalid and empty data, confirm error messages appear, and check that submitted data actually lands where it should (database, inbox or integration).
- How do I test user registration?Sign up with a real and a duplicate email, confirm verification emails arrive, check password rules, and confirm a new account only gets the access it should.
- How do I test password reset?Request a reset with a real account, confirm the email arrives with a working link, complete the reset, and confirm the old password stops working and the reset link can't be reused.
- How do I test payments?Run a real Stripe test-mode transaction end to end — checkout, webhook, database update and confirmation email — before switching to live keys.
- How do I test admin permissions?Log in as a non-admin account and try to reach every admin action directly (URLs, buttons, API calls) to confirm the server — not just the UI — blocks it.
- How do I test RLS?Try reading and writing data as a different logged-in user and as a logged-out visitor to confirm row-level security actually blocks what it should, rather than assuming the policy is correct.
- How do I test SEO?Check that every page has a unique title and meta description, images have alt text, the site generates a sitemap, and preview the page as a search engine or social share would see it.
- How do I test website speed?Run the published (not local) URL through a tool like Google PageSpeed Insights or WebPageTest, and check real load times on mobile data, not just your fast office wifi.
- How do I test different browsers?Open the published site in at least Chrome, Safari and Firefox on both desktop and mobile, and check layout, forms and any browser-specific features work in each.
- How do I check for broken links?Click through every nav item, footer link and CTA yourself, or ask Lovable to list every link on the site so you can verify each one resolves before launch.
- How do I check for console errors?Open your browser's developer console on every key page of the published site and look for red error messages — then ask Lovable to fix each one by name.
- How do I back up my project before launch?Bookmark the current state in Version history, and push to a connected GitHub/GitLab repo via Git sync so you have a full backup outside Lovable too.