> For the complete documentation index, see [llms.txt](https://docs.klai.studio/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.klai.studio/v1/reference/actions-processor/actions_overview/showmodal.md).

# showModal / hideModal

{% hint style="info" %}
This element is based off of <http://sweet-modal-vue.adepto.as>
{% endhint %}

| Key               | Value                                                      |
| ----------------- | ---------------------------------------------------------- |
| `action`          | showModal                                                  |
| `options.text`    | Text to show within the modal, also accepts HTML code here |
| `options.options` | object - additional options to the parent options          |

#### Example action object

```yaml
// action  object for 'showModal'
{
  "action": "showModal",
  "options": {
    "body": "This is a modal!",
    "icon": "warning",
    "options": {},
    "overlayTheme": "light",
    "text": "Welcome User",
    "slots" : []
  }
}
```

To hide the modal, use the `hideModal` action.

```yaml
{
  "action": "hideModal"
}
```

{% hint style="warning" %}
**NOTE:** Modals are different than Card Modals, and require separate actions. You cannot use a `hideModal` action to close a Card Modal.
{% endhint %}

{% content-ref url="/pages/-LSh-HpuyJ0Oc71yypW7" %}
[Card / Window Modals](/v1/reference/form-settings/card-modals.md)
{% endcontent-ref %}

## FileMaker Custom Function

You can call the "hideModal" action using FileMaker during a [hook script](/v1/reference/hooksoverview.md) using this function:

```
Set Variable $$BF_Actions = BF_SetAction( "hideModal" ; "" )
```