# Floating action button

The **Floating action button** UI component is positioned above other page content and triggers an action. It shares similarities with the [Button](https://docs.appfarm.io/library/ui-components/button) and [Icon button](https://docs.appfarm.io/library/ui-components/icon-button) components. A Floating action button can have an icon and optional text and is more visually emphasized than other button types. It is recommended to use a Floating action button for the main action on a page/view.

A common use case is to position the button in the bottom corner of the screen, for example if you have a table listing all active users, a Floating action button can be placed under the table which runs an action to add a new user to the app.

As with all buttons, the *On Click* event handler can be used to connect the component to an action, and every time a user clicks the button, the action will be triggered.

{% hint style="info" %}
You can see an example setup of the **Floating action button** in the UI Components app in our [Showroom](https://showroom.appfarm.app/ui-components/floatingactionbutton). You can try the component, as well as access the setup in Appfarm Create. If you do not have access, you can register [here](https://showroom.appfarm.app/sign-up).
{% endhint %}

## Settings

Here are some properties in Appfarm Create which are configurable for a Floating action button:

### Icon

Icons can be connected to the button. These can make the button more intuitive, by using symbols instead of words.

### Extended

With this property enabled, you can add an optional label to the button.

### Conditional Properties

If the button's appearance should differ depending on a condition which can change over time, then using Conditional Properties is recommended. The properties, and conditions for when they should override the given default, are defined in this section.

### Event Handlers

Actions can be configured here, and these are run each time the button is clicked.