---
title: Button
description: A button component for custom button styles.
---



```kotlin expandable title="ButtonDemo.kt" githubUrl="https://github.com/composablehorizons/compose-unstyled/blob/main/demo/src/commonMain/kotlin/com/composeunstyled/demo/button/ButtonDemo.kt"
import androidx.compose.foundation.LocalIndication
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.heightIn
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.RectangleShape
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.composeunstyled.Text
import com.composeunstyled.UnstyledButton
import com.composeunstyled.demo.borderToken
import com.composeunstyled.demo.colors
import com.composeunstyled.demo.surfaceToken
import com.composeunstyled.theme.Theme

@Preview
@Composable
fun ButtonDemo() {
  Box(
    modifier = Modifier.fillMaxSize(),
    contentAlignment = Alignment.Center,
  ) {
    UnstyledButton(
      onClick = { },
      modifier = Modifier
        .clip(RectangleShape)
        .heightIn(32.dp)
        .background(Theme[colors][surfaceToken])
        .border(1.dp, Theme[colors][borderToken], RectangleShape),
      contentPadding = PaddingValues(horizontal = 10.dp),
      indication = LocalIndication.current,
    ) {
      Text("Button")
    }
  }
}
```



## Installation

```kotlin
implementation("com.composables:composeunstyled-button:2.10.0")
```

## Anatomy

```kotlin
UnstyledButton(onClick = onClick) {
}
```

## Concepts

- `UnstyledButton` represents the clickable button surface.

## Accessibility

`UnstyledButton` uses `Role.Button` by default. Enter and Space activate it.

## Code Examples

### Disabling a button

Use the `enabled` parameter to prevent button activation:

```kotlin expandable
UnstyledButton(
  enabled = false,
  onClick = { submit() },
) {
  BasicText("Submit")
}
```

## API Reference

### UnstyledButton

| Parameter | Type | Description |
|-----------|------|-------------|
| `onClick` | `() -> Unit` | The callback to be invoked when the button is clicked. |
| `enabled` | `Boolean` | Whether the button is enabled. |
| `contentPadding` | `PaddingValues` | Padding values for the content. |
| `modifier` | `Modifier` | Modifier to be applied to the button. |
| `role` | `Role` | The role of the button for accessibility purposes. |
| `indication` | `Indication?` | The indication to be shown when the button is interacted with. |
| `interactionSource` | `MutableInteractionSource?` | The interaction source for the button. |
| `contentAlignment` | `Alignment` |  |
| `content` | `() -> Unit` | A composable function that defines the content of the button. |