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

# Indicators

> The indicators (Message UI elements) allow you to display different types of messages.

Messages can be categorized into the following types:

* **Info**: Used to convey general information to users.
* **Warning**: Indicates potential issues or important notices.
* **Error**: Highlights errors or critical issues.
* **Success**: Communicates successful operations or completion.

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicators_gen.png)

## Properties

When configuring a message, you have the following properties:

* **Message**: The content of the message body, this property supports markdown attributes such as: bold, italic, bold italic, strikethrough and URLs, allowing you to format the content of the message.
* **Type**: one of the four indicator types: info, warning, error, success
* **Expressions**: you can define expressions to control when the message should be hidden. This can be useful for dynamically showing or hiding messages based on specific conditions.
* **Platform overrides**: the **Message** text and the **Hide** expression can be overridden per platform. Select the message element, then go to **Settings** → your desired platform → **Overrides (+)** and pick **Message** or **Expressions** → **Hide**. Use this to show a shorter message on mobile or hide the banner on one platform only.

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicators_prop.png)

Info example with markdown:

```markdown theme={"dark"}
If you are encountering any difficulties, please [contact our support team](mailto:support@flowx.ai).
```

When executed, will look like this:

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicators1.png)

## Types and Usage

Here's how you can use the Message UI element in your UI design:

### Info

If you are encountering any difficulties, please [contact our support team](mailto:support@flowx.ai).

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/info_indicator.png)

### Error

An error occurred while processing your request. Please try again later.

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicator_error.png)

### Success

Your payment was successfully processed. Thank you for using our services!

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicator_success.png)

## Indicators styling

To create an indicator with specific styling, sizing, typography, and color settings, you can use the following configuration:

### Style

The Style section allows you to customize the appearance of your indicator UI element. You can apply the following style to achieve the desired visual effect:

* **Text**: Displays only the icon and the text.

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicator_text.png)

* **Border**: Displays the icon, the text and the border.

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicator_border.png)

* **Fill**: It will fill the UI element's area.

![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/release34/indicator_fill.png)

> [!TIP]
>
> For more information, see the [styling documentation](https://docs.flowx.ai/6.x/docs/building-blocks/ui-designer/ui-designer.md#styles-tab).


## Related topics

- [UI Designer](https://docs.flowx.ai/6.x/docs/building-blocks/ui-designer/ui-designer.md)
- [FlowX.AI 5.1.6 Release Notes (LTS)](https://docs.flowx.ai/release-notes/v5.x/v5.1.x-lts/v5.1.6-march-2026.md)
- [Managing stores](https://docs.flowx.ai/6.x/docs/platform-deep-dive/integrations/knowledge-base-integration/managing-content.md)
- [Chat component](https://docs.flowx.ai/6.x/ai-platform/chat-component.md)
- [Input field](https://docs.flowx.ai/6.x/docs/building-blocks/ui-designer/ui-component-types/form-elements/input-form-field.md)


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