Who buys this
Independent cosmetics brands selling online who lose sales to shade uncertainty and then pay for the returns.
Where to start in Lovable
Paste this into Lovable as the opening prompt. It sets up one screen and one job, which is easier to grow from.
Build a shade matching and try on page for a cosmetics shop. A visitor uploads a selfie or uses the camera, and the app detects lips, cheeks and eyes and renders the selected product shade on the photo with adjustable intensity. Beside the preview show the three closest shades from the catalogue with a plain sentence explaining the match. Everything runs in the browser and no photo is uploaded to a server unless the visitor saves a look. Add a share card and a direct add to cart link per shade.
What you will need to wire up
- Face landmarks в браузере
- Lovable Cloud (Postgres)
- Storage только для сохранённых образов
- Stripe
Build order
- Do the rendering on the device. Landmark detection and blending run in the browser on a canvas. That keeps the preview instant, keeps your server costs near zero and makes the privacy promise real rather than a policy sentence.
- Match on skin tone, not on a colour picker. Sample skin from several patches, correct for the light in the photo, then compare against catalogue shades in a perceptual colour space. Matching raw pixel values gives confident answers that are visibly wrong indoors.
- Show honest limits. Warn on yellow indoor light, heavy filters and low resolution, and say the screen is an approximation. A brand that oversells the preview gets the returns back with an angry message attached.
- Measure the only number that matters. Track add to cart rate for sessions that used the try on against those that did not, per product. That table is your entire sales pitch to the next brand.
Where this usually breaks
- Camera colour varies wildly between phones. Normalise with a white reference in the frame or a fixed correction per detected light temperature, and never claim exact colour.
- Face data is sensitive in several jurisdictions. Process in memory, do not store landmarks, and require an explicit action before any image leaves the device.
- Older phones drop frames on live video and the effect looks broken. Detect low frame rates and switch to a single photo mode automatically.
How it makes money
- Per store subscription. Tier by catalogue size, because a brand with four hundred shades needs the shade matching far more than one with twelve.
- Paid catalogue setup. Getting real shade values out of product photos is manual work worth charging for, and it is the part a competitor cannot copy in a weekend.
Build this on Lovable
The prompt above is ready to paste. Open Lovable, drop it in and get a first working version in minutes. Free plan, no card, 5 credits a day.
Try Lovable+10 free creditsAffiliate link. The commission is ours, the price for you is the same.