Quickstart

The face-age SDK detects skin age, wrinkles, acne, dark circles, pores, pigmentation, oiliness and more — then shows personalized product recommendations and routines, embedded directly in your website or app.

Face Age SDK: skin analysis with 13 concerns, skin age and health, quiz, routines, PDF report, history and compare, products, 40 languages and analytics events

How it works

Embed

Add a <div> to your page and initialize FaceAge with your Client ID.

User scans

The user takes a photo or uploads one, and the SDK runs the AI analysis.

Results display

Skin age, damage score and detected problems are shown.

Recommendations

Matched products and routines from your catalog appear automatically.

Your code reacts

Use the SDK API and events to connect to your cart, CRM or analytics.

1. Get your Client ID

You need a Face Age Client ID — the Face Age ID in the API keys page of your business in the panel. See Getting set up.

2. Install

npm install face-age --save

yarn add face-age

<script src="https://cdn.jsdelivr.net/npm/face-age"></script>

3. Render

Add a container element to your HTML:

<div id="FaceAge-module"></div>

Then initialize and render:

import FaceAge from 'face-age';

const faceAge = new FaceAge({
  elementId: 'FaceAge-module',   // your container element ID
  faceageId: '<Your Client ID>', // get yours at panel.getfaceage.com
  showProducts: true,
  showRoutine: true,
});

faceAge.render();

That’s it — the skin analysis now runs on your page as a section.

What’s next

Work through the guide in order, or jump to what you need:

Display modes

Section, modal or widget — with a live demo of each.

Analysis

Skin concerns, the report, history and compare.

Personalization

Quiz, product recommendations, routines and discounts.

Integrations

Events, analytics and CRM.

Get started

Display modes

Analysis

Personalization

Integrations

Reference

Frameworks

Skin analyze widget

How it works

1. Get your Client ID

2. Install

3. Render

What’s next

Display modes

Analysis

Personalization

Integrations

​How it works

​1. Get your Client ID

​2. Install

​3. Render

​What’s next

Display modes

Analysis

Personalization

Integrations

How it works

1. Get your Client ID

2. Install

3. Render

What’s next