> ## Documentation Index
> Fetch the complete documentation index at: https://getfaceage.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Section

> Render the skin analysis inline as a full row on any page.

A section occupies a full row on any page — your home page, a landing page, or a skin-analysis page of its own. It's the default display model.

[Face Age section demo](https://getfaceage.com/embed/demo/section)

Live demo — the real SDK in section mode on the Lumière sample store

## Add a section

Add a container where the section should appear, then render with `displayModel: 'section'`:

```html theme={null}
<!-- where the section appears -->
<div id="face-age"></div>
```

```js theme={null}
import FaceAge from 'face-age';

const faceAge = new FaceAge({
  elementId: 'face-age',
  faceageId: '<Your Client ID>',
  displayModel: 'section',
  height: '800px', // optional
});

faceAge.render();
```

## Options

| Option | Default | Description |
| - | - | - |
| `elementId` | — | **Required.** ID of the container element. |
| `height` | `'800px'` | Height of the section. |

All other options — quiz, products, routines, history — work the same in every mode. See [Configuration](https://getfaceage.com/docs/developer-guides/reference/configuration.md).

## When to use it

* A dedicated "Find your routine" or "Skin analysis" page.
* A block on your home page that invites shoppers to scan.
* A quiz page where the scan is the main content.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.