---
title: "IconButton"
description: "IconButton is a clickable icon, used to represent actions. An IconButton has an overall minimum
touch target size of 48 x 48dp, to meet accessibility guidelines. `content` is centered inside
the IconButton."
type: "component"
---

<div class='type'>Composable Component</div>



IconButton is a clickable icon, used to represent actions. An IconButton has an overall minimum
touch target size of 48 x 48dp, to meet accessibility guidelines. `content` is centered inside
the IconButton.

<a id='references'></a>

<div class='sourceset sourceset-common'>Common</div>


```kotlin
@Composable
fun IconButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    interactionSource: MutableInteractionSource? = null,
    content: @Composable () -> Unit,
)
```


#### Parameters

| | |
| --- | --- |
| onClick | the lambda to be invoked when this icon is pressed |
| modifier | optional `Modifier` for this IconButton |
| enabled | whether or not this IconButton will handle input events and appear enabled for semantics purposes |
| interactionSource | an optional hoisted `MutableInteractionSource` for observing and emitting `Interaction`s for this IconButton. You can use this to change the IconButton's appearance or preview the IconButton in different states. Note that if `null` is provided, interactions will still happen internally. |
| content | the content (icon) to be drawn inside the IconButton. This is typically an `Icon`. |






## Code Examples
### IconButtonSample
```kotlin
@Composable
fun IconButtonSample() {
    IconButton(onClick = { /* doSomething() */ }) {
        Icon(Icons.Filled.Favorite, contentDescription = "Localized description")
    }
}
```