---
title: Well-Being Circle Widget  V1 - deprecated
slug: technical-docs/well-being-circle-widget-v1-deprecated
docTags: 
createdAt: 2024-10-08T11:23:15.902Z
---

# Intro

The Well-Being Circle Widget provides a quick and comprehensive overview of the user’s overall health status. Displaying individual scores across key health topics gives users an easy-to-read assessment of their physical, mental, and emotional well-being. This widget adapts to real-time updates, making it ideal for platforms focused on continuous health monitoring. Integrate it anywhere on your site to provide users with a rapid visual snapshot of their overall wellness.

# Layout

**Large**

::Image[]{src="https://api.archbee.com/api/optimize/_0R_DnpmBBLLXmaoWvG2u/6bEYepR49tZDmS6BseF39_box-l-wellbeing.png" size="46" width="821" height="1007" position="center" showCaption="false"}

[View the IntelliWidgets.js reference ->](docId\:dEkcuoAPHRmcZXe_caJ5v)

# Usage

## Creating the widget

The code snippet below creates a Well-being widget and [mounts](docId\:sXVSW2jFSOhr7XbXEYZ_J) it to the DOM:

:::CodeblockTabs
Create and mount widget

```javascript
const intelli = IntelliProveWidgets("user_action_token");

const config = { /* config */ };
const variation = "default";
const themeOverrides = { /* theme overrides */ };
intelli.mountWidget(
    "#wb-circle-tile",
    "well-being-circle",
    config,
    variation,
    themeOverrides,
    1
);
```
:::

## Config

The Well-being Circle widget requires no additional configuration parameters.

## Variation

Only one variation of the Well-being Circle Widget is available.

- "default"

## Theme Overrides

The Well-being Circle Widget allows [individual fine-tuning of the appearance](docId:2kL5Bnrb-6uIcQrFAqsiG).

The used accent colors are: 

- Brand primary
- Brand secondary
- Support 500