The Problem
You published your app, updated everything in Lovable, but when you share the link on WhatsApp it still shows the Lovable logo instead of your image.
Let's be honest: your project doesn't feel like yours until it has your own favicon and OG image. Here's how to fix it.
The Easy Way: Just Ask Lovable
The simplest solution? Just upload your favicon in the Lovable chat and say:
"Change my favicon to this"Make sure your image is around 32x32 or 48x48 pixels for best results.
You can also go to Publish → Website Info (top right) and update there directly.
Don't Have a Favicon? Generate One
If you don't have a favicon or can't create one, just ask Lovable:
"Generate a favicon for my app based on the theme and colors"Or be more specific:
"Create a simple favicon with the letter M in a circle, using my brand colors"Lovable will generate one for you and apply it automatically.
The Emoji Trick (to remove Lovable favicon)
If Lovable keeps defaulting to its logo, try this:
- First, ask Lovable: "Change my favicon to an emoji 🚀"
- Verify it changed (check browser tab)
- Then ask: "Now change the favicon to my logo"
Tip: This "resets" the favicon and ensures you can fully replace it. Works most of the time when direct replacement fails.
Updating the OG Image
The OG image is what shows when you share your link on social media.
- Go to Publish → Website Info
- Click on Share image to upload your image (1200x630px recommended)
- Update the Description for the meta description
Or just upload the image in chat and ask Lovable to set it as your OG image.
Don't have an OG image? Ask Lovable:
"Generate an OG image for my app with the title and a preview of the main screen"Manual Method (via code)
If you need more control, edit index.html directly:
For favicon:
<link rel="icon" type="image/png" href="/your-favicon.png" />For OG image:
<meta property="og:image" content="https://your-domain.com/og-image.png" />
<meta name="twitter:image" content="https://your-domain.com/og-image.png" />Important: Use the full URL with https://, not just the relative path. Social platforms need the complete URL to fetch the image.
Clearing WhatsApp/Facebook Cache
Even after updating everything, WhatsApp might show the old image because it's cached.
Option A: Facebook Sharing Debugger
Go to the Facebook Sharing Debugger, paste your URL, and click "Scrape Again". This forces Facebook/WhatsApp to refresh the image.
Option B: Add a query param
If the debugger doesn't work immediately, add a parameter to your URL:
https://your-app.com?v=2Change the number each time you update the image (v=3, v=4, etc).
Option C: Wait
WhatsApp can take 24-48 hours to update the cache automatically.
Tip: The cache is the culprit 90% of the time. Always use the Facebook Debugger first before assuming something is broken.
Verify It Worked
Before sharing, use one of the tools below to test your URL.
Links and Resources
OG Image & Meta Tag Checkers:
- Facebook Sharing Debugger - The most important one, also clears WhatsApp cache
- Twitter Card Validator - Test how your link looks on Twitter/X
- OpenGraph.xyz - Quick preview of all your meta tags
- Metatags.io - Preview how your site looks on Google, Facebook, Twitter, LinkedIn
Favicon Generators:
- Favicon.io - Generate from text, image, or emoji
- RealFaviconGenerator - Generates all sizes for all platforms
- Lovable Favicon Generator - Made specifically for Lovable projects
Lovable Docs:
- Publish your app - Lovable Docs - Official guide on publishing and meta tags
- Adding Favicon in Lovable - RapidDev - Step by step guide