# KPI card

The KPI cards allows for a quick view of a specific value. To alert users,  KPI cards can be configured to show specific colors based on setup rules.

## General

General data is required for all portlets.

[General configuration](/6.12/development/flow-portal-2/portlets/common-configuration.md#general)

## Listeners

The portlet can listen to the following events:

* On Row Selection
* On Refresh
* On Point Selection

The portlet can send the following events:

* On Row Selection
* On Refresh

<div align="left"><img src="/files/-M8tdeRkGDv_oeIZzc-x" alt=""></div>

[Listeners configuration](/6.12/development/flow-portal-2/portlets/common-configuration.md#listeners)

## Data

### Data source

The portlet data source configuration enables the portlet to execute specified queries towards the chosen database connector to fetch data, or fetch data from a workflow.

* Database: uses a flow connector to retrieve data from a database
* Workflow: runs a workflow to retrieve data

[Data source configuration](/6.12/development/flow-portal-2/portlets/common-configuration.md#database-source)

[Workflow source configuration](/6.12/development/flow-portal-2/portlets/common-configuration.md#workflow-source)

### Presentation

Under presentation, add the data which is to be shown in the KPI card:

* Value: the value which is to be displayed as the main information in the portlet
* Unit: the unit of the value
* Description: the description to describe the value

<div align="left"><img src="/files/-M0Yxvk4OtKyFTD-q7DZ" alt=""></div>

<div align="left"><img src="/files/-M0YpJD8x8n4IfCg1P_Q" alt=""></div>

## Background color rules

The KPI card can have its background color changed (default color). It can also have one or more color rules, for example to be used to make the background color change to indicate the value is below or above a certain threshold. A color rule will always have priority over the default color and override this if its condition is met.

To enter a new rule:&#x20;

* click *New*
* select a color
* enter the condition field, operator and value
* preview the result or save&#x20;

To edit an existing rule, click on the rule and it expands into edit mode.&#x20;

<div align="left"><img src="/files/-M8jpilG6Z22jz04E829" alt=""></div>

## Text color rules

The color of value and unit can be configured under *text color rules*. A default color can be applied that will always show unless overridden by a color rule.

To enter a new rule:&#x20;

* click *New*
* select a color
* enter the condition field, operator, and value&#x20;
* preview the result or save

To edit an existing rule, click on the rule and it expands into edit mode.&#x20;

<div align="left"><img src="/files/-M8pHyL91Zh_FlP-Nlgz" alt=""></div>

## Description color rules

The color of the description text can be set using a default color or apply color rules.

To enter a new rule:&#x20;

* click *New*
* select a color
* enter the condition field, operator, and value&#x20;
* preview the result or save

To edit an existing rule, click on the rule and it expands into edit mode.

<div align="left"><img src="/files/-M8pIvykH6zHXRbIGFkb" alt=""></div>

## Style

Change the header text color and add a header stripe by configuring style.

[Style configuration](/6.12/development/flow-portal-2/portlets/common-configuration.md#style)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.novacuraflow.com/6.12/development/flow-portal-2/portlets/kpi-portlets/kpi-1.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
