Skip to main content
Prerequisites — before implementing AI Try-On, complete the Cookie consent and Installation steps on the JS Library page. Kleep must not load until the visitor has consented via your CMP, and the library must be loaded site-wide.
AI Try-On is available on demand. If you’re unsure whether this feature is enabled for your account, contact your Kleep representative.

​
What AI Try-On does

AI Try-On lets shoppers see products on themselves. Clicking a Try it on button on your product page opens the virtual try-on in a full-screen overlay: the shopper takes a selfie and a full-body photo, and Kleep generates a photorealistic image of them wearing the product. Closing the overlay brings them back to your product page.

​
Product feed requirements

AI Try-On is built from the product feed you already send to Kleep — no extra file is needed. For each product, Kleep picks one on-model photo among its images, crops the model’s head out of it, and generates the try-on from that photo. Your products file (see the Product template) must meet these conditions:
Keep the on-model photo at the same position for every product — for example, always the second image. Kleep can then set up your whole catalog in one go instead of picking the photo product by product.
  • Image URLs must be publicly accessible. Kleep downloads them server-side, so no authentication or hotlink protection, and standard formats (JPEG, PNG, WebP). Use the same high-resolution image as on your product page.
  • Keep image URLs stable. Changing a product’s photo resets its try-on setup, and the product has to be activated again.
  • New products aren’t picked up automatically yet. After a collection drop, tell your Kleep representative so the new products get set up.
Once your feed is in place, your Kleep team selects the photo, crops it and activates each product from your Kleep Dashboard. Only activated products can be tried on.

​
Methods

​
kleep.vto — Open the virtual try-on

  1. Add a button where you want the CTA on the product page:
  2. Call kleep.vto when the shopper clicks it:
We leave the markup and CSS styling of the button to you. kleep.vto reuses the public_id, product_id and lang you passed to kleep.load, so make sure kleep.load ran first on the product page.

​
Parameters

All parameters are optional when kleep.load has been called on the page. Pass them to open the try-on for another product, or on a page where kleep.load isn’t called:

​
Behaviour

  • The try-on opens in a full-screen overlay on top of your page. The page behind it doesn’t scroll.
  • Shoppers close it with the ✕ button, the Escape key, or from inside the try-on. Only one overlay can be open at a time.
  • The flow is stateless: closing the overlay discards the photos and the result.
  • Camera access requires HTTPS. If your site sends a Content-Security-Policy header with a frame-src directive, add https://vto.kleep.ai to it.
Product eligibility. Only products activated for try-on (see Product feed requirements) can be tried on. The button is yours to display, so only show it on activated products — otherwise the shopper sees a “not available for this product yet” message inside the try-on.

​
Cookies & data privacy

Kleep is fully gated by visitor consent: the script only loads after consent is collected through your CMP, and you must condition its loading accordingly. For the complete list of trackers, the data processed, the purposes and legal bases, hosting, subprocessors and security, see Cookies, CMP & Data Privacy.