Composable Component

FloatingActionButton

The FAB represents the most important action on a screen.

FloatingActionButton social preview

FloatingActionButtonSample

@OptIn(ExperimentalMaterial3Api::class)
@Preview
@Composable
fun FloatingActionButtonSample() {
    // A FAB should have a tooltip associated with it.
    TooltipBox(
        positionProvider =
            TooltipDefaults.rememberTooltipPositionProvider(TooltipAnchorPosition.Above),
        tooltip = { PlainTooltip { Text("Localized description") } },
        state = rememberTooltipState(),
    ) {
        FloatingActionButton(onClick = { /* do something */ }) {
            Icon(Icons.Filled.Add, "Localized description")
        }
    }
}