✦ Spell 6 · 20 min
Changing Photos, Colors and Layout
Goal: Make basic design updates safely.
What you will learn
- How to upload and replace photos
- How to change colors and button labels
- How to keep your branding consistent
- Why image size, quality and licensing matter
Replacing a photo
In the Lovable chat you can usually attach an image file, then describe where it should go. Be specific about which photo you are replacing.
- 1Choose a clear, well-lit photo you have the right to use.
- 2Attach it in the chat.
- 3Say exactly which photo it replaces and that everything else should stay the same.
- 4Check the preview on both a wide screen and a phone-sized screen.
Example prompt
Replace the photo in the About section with the image I uploaded. Keep the existing text, colors, spacing and layout unchanged.
Verify in your Lovable account
How you attach images or use visual editing may vary. Verify in your Lovable account.
Visual edits (docs)Before
Welcome to My Website
SubmitAfter
Helping You Live Your Best Life
Book a CallColors, buttons and sections
Your website has a brand palette: a small set of colors that appear again and again. Changing one color in one spot can make your site feel patchy. Ask Lovable to use your existing brand colors whenever possible.
Button labels should be short action words, like “Book a Call” or “See Services.”
To move a section, name it and say where it should go: “Move the Testimonials section so it sits directly below the Services section.”
Photo quality, size and licensing
Big photos straight from a camera can make your website slow. A width of around 1600–2000 pixels is usually plenty for a large banner photo. Ask your developer if you’re unsure.
Only use photos you took, paid for, or that are clearly free to use for business. Grabbing a photo from a search engine can lead to copyright problems.
Practice activity
Before & after prompt picker
Pick a design task to see a before-and-after preview and a ready-to-copy prompt.
Before
Our Services
Click hereAfter
Our Services
Click hereReplace the photo in the [SECTION NAME] section of the [PAGE NAME] page with the image I uploaded. Keep the existing text, colors, spacing and layout unchanged.
Common mistakes
Using a photo from a web search.
Use your own photos or properly licensed stock images.
Picking a brand-new color for every update.
Ask Lovable to use your existing brand colors.
Only checking the desktop view.
Most visitors use phones. Always check a phone-sized view.
Knowledge quiz
Three quick questions. Retake as often as you like.
Answer every question to continue.