---
title: "LeadingIconTab"
description: "Tabs organize content across different screens, data sets, and other interactions."
type: "component"
---

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



Tabs organize content across different screens, data sets, and other interactions.

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

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


```kotlin
@Composable
fun LeadingIconTab(
    selected: Boolean,
    onClick: () -> Unit,
    text: @Composable () -> Unit,
    icon: @Composable () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    selectedContentColor: Color = LocalContentColor.current,
    unselectedContentColor: Color = selectedContentColor,
    interactionSource: MutableInteractionSource? = null,
)
```


#### Parameters

| | |
| --- | --- |
| selected | whether this tab is selected or not |
| onClick | called when this tab is clicked |
| text | the text label displayed in this tab |
| icon | the icon displayed in this tab. Should be 24.dp. |
| modifier | the `Modifier` to be applied to this tab |
| enabled | controls the enabled state of this tab. When `false`, this component will not respond to user input, and it will appear visually disabled and disabled to accessibility services. |
| selectedContentColor | the color for the content of this tab when selected, and the color of the ripple. |
| unselectedContentColor | the color for the content of this tab when not selected |
| interactionSource | an optional hoisted `MutableInteractionSource` for observing and emitting `Interaction`s for this tab. You can use this to change the tab's appearance or preview the tab in different states. Note that if `null` is provided, interactions will still happen internally. |






