> For the complete documentation index, see [llms.txt](https://swift-packages.gitbook.io/materialuikit/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://swift-packages.gitbook.io/materialuikit/components/action-button.md).

# Action Button

Represents a Material UI styled button for performing actions with various visual styles.

### Overview

The `ActionButton` component allows you to create buttons with Material design styles, such as elevated, filled, tonal, outline, and text. It also offers stretched versions of these styles for buttons that need to occupy the maximum available width.

To use the `ActionButton`, initialize it with a title key for the button’s text and an action closure that defines the button’s behavior when pressed.&#x20;

### Initializers

Creates a button with a default `.filled` style.

<pre class="language-swift"><code class="lang-swift"><strong>ActionButton(_ titleKey: String, action: @escaping () -> Void)
</strong></code></pre>

Creates a button with a custom style.

```swift
ActionButton(
    _ titleKey: String,
    style: ActionButtonStyle,
    action: @escaping () -> Void
)
```

> For detailed descriptions of the available button styles, refer to the [ActionButtonStyle](/materialuikit/components/action-button/actionbuttonstyle.md).

### Parameters

<table data-header-hidden><thead><tr><th width="177"></th><th></th></tr></thead><tbody><tr><td><strong>Parameter</strong></td><td><strong>Description</strong></td></tr><tr><td><code>titleKey</code></td><td>The text key to display on the button.</td></tr><tr><td><code>style</code></td><td>The style of the button.</td></tr><tr><td><code>action</code></td><td>The closure to execute when the button is pressed.</td></tr></tbody></table>

### Modifiers

Sets the corner radius for an action buttons.

```swift
actionButtonCornerRadius(_ cornerRadius: CGFloat)
```

Sets the font size for an action buttons within the environment.

```swift
actionButtonFontStyle(_ font: Font)
```

Sets the font weight for an action buttons within the environment.

```swift
actionButtonFontWeight(_ fontWeight: Font.Weight)
```

### Example

Displays the action button with default `ActionButtonStyle.filled` style.

```swift
ActionButton("Action Button") {
    Void()
}
```

<figure><picture><source srcset="/files/4HDzo63ZTzgmviVDnVxB" media="(prefers-color-scheme: dark)"><img src="https://2931569195-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHpwjDgYAa64eKF8AGmeE%2Fuploads%2FgWHpHqDfOuIykS6A79bv%2FAction%20Button%20Light.png?alt=media&amp;token=e9bfe57c-07b8-4150-bda2-d1cbb46e56d7" alt=""></picture><figcaption></figcaption></figure>

Displays the action button with custom style.

```swift
ActionButton("Cancel", style: .outlineStretched) {
    Void()
}
```

<figure><picture><source srcset="/files/VOXUnMvYvTGIhi3jlyZt" media="(prefers-color-scheme: dark)"><img src="https://2931569195-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHpwjDgYAa64eKF8AGmeE%2Fuploads%2FyXslHUGbyPELLAmIEWHn%2FLight%20Button%20Large.png?alt=media&amp;token=4cfc6abc-7999-495e-a174-e1465533d421" alt=""></picture><figcaption></figcaption></figure>

Displays the action button with default style and custom corner radius, font style and font weight.

```swift
ActionButton("Action Button") {
    Void()    
}
.actionButtonCornerRadius(10)
.actionButtonFontStyle(.headline)
.actionButtonFontWeight(.heavy)
```

<figure><picture><source srcset="/files/3YXHrkXDkoIZtm7h9CJH" media="(prefers-color-scheme: dark)"><img src="https://2931569195-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHpwjDgYAa64eKF8AGmeE%2Fuploads%2FzICnMdqPvkzX4ThCoUWw%2FCustom%20Button%20Light.png?alt=media&amp;token=619e40fb-69fb-4963-8f9f-4b8650902fae" alt=""></picture><figcaption></figcaption></figure>

> `ActionButton` uses the default configuration's values for corner radius, font style, and font weight if custom values are not specified.
