# Clickable

For elements that do not have click events, they can be wrapped with a clickable. which effectively turns it into a button.

By default, a clickable is an empty container into which you can drag other elements.

<figure><img src="/files/8ggFq4CsdRdnEqj1Fh3f" alt=""><figcaption></figcaption></figure>

## Properties

<figure><img src="/files/TGawUs0KJiRFrAF4D4FH" alt=""><figcaption></figcaption></figure>

**Hover color:** Background color when mouse hovers over the clickable.

**On Hover color:** Color of text in the clickable when hovered over.

**On Active color:** Color of text in the clickable as it is being clicked.

**Animate Color:** Length of animation in milliseconds.

**Text:** Displayed text. Note that once an element is dragged into the clickable, the text will no longer be visible.

See [Tooltip](/app-builder/app-construction/elements/tooltip.md) for tooltip configurations.

## Supported Events

**Click Element:** Triggered when a user clicks on the element(s) in the clickable.

## Supported Actions

**Set Text:** Set text property of the clickable.

**Set Data:** Change element data. See [Data Store](/app-builder/app-construction/data-store.md).

**Set Loading:** Set loading animation. See [Set loading animations](/app-builder/popular-use-cases/set-loading-animations.md).

{% hint style="info" %}
Visit [Interactions](/app-builder/app-construction/interactions.md) for more on events and actions.
{% endhint %}


---

# 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://docs.acho.io/app-builder/app-construction/elements/web-elements/clickable.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.