# Create an error alert dismissible

## Overview

This page walks you through configuring the Alert component to display an error message. that is dismissible.

## Result

The final result will look like this:

<figure><img src="https://27923732-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1FUd4apB9YHgCEMUFbVb%2Fuploads%2FIV97vgkCPG1cVD5cXGXa%2F2022-12-02_11-29-41.png?alt=media&#x26;token=dac60ed5-b118-479e-8545-1cfdf2abfa05" alt=""><figcaption></figcaption></figure>

## Steps

The steps to create an error alert that is dismissible are as follows:

### 1. Add the Alert component

* Drag the **Alert component** from the components list to our screen flow (located under the custom section)
* Enter an **API Name**. For example, *Alert*.

{% @arcade/embed flowId="2dAkH0SCi63UV5Xq0lE1" url="<https://app.arcade.software/share/2dAkH0SCi63UV5Xq0lE1>" %}

### 2. Configure the Alert component

* **Open the Component Builder** to access all settings
* Select the **variant: error**
* Icon name: **utility:error**
* **Is dismissible: set to true**
* Content: My error message

{% @arcade/embed flowId="Ux5T6Q6N7W8rgiyVCrOC" url="<https://app.arcade.software/share/Ux5T6Q6N7W8rgiyVCrOC>" %}