---
title: "ripple"
description: "Creates a Ripple using the provided values and values inferred from the theme.

A Ripple is a Material implementation of [Indication] that expresses different [Interaction]s by
drawing ripple animations and state layers.

A Ripple responds to [PressInteraction.Press] by starting a new animation, and responds to other
[Interaction]s by showing a fixed state layer with varying alpha values depending on the
[Interaction].

[MaterialTheme] provides Ripples using [androidx.compose.foundation.LocalIndication], so a Ripple
will be used as the default [Indication] inside components such as
[androidx.compose.foundation.clickable] and [androidx.compose.foundation.indication], in addition
to Material provided components that use a Ripple as well.

You can also explicitly create a Ripple and provide it to custom components in order to change
the parameters from the default, such as to create an unbounded ripple with a fixed size.

To create a Ripple with a manually defined color that can change over time, see the other
[ripple] overload with a [ColorProducer] parameter. This will avoid unnecessary recompositions
when changing the color, and preserve existing ripple state when the color changes."
type: "function"
---

<div class='type'>Function</div>


<a id='references'></a>
<div class='sourceset sourceset-common'>Common</div>


```kotlin
fun ripple(
    bounded: Boolean = true,
    radius: Dp = Dp.Unspecified,
    color: Color = Color.Unspecified,
): IndicationNodeFactory
```


Creates a Ripple using the provided values and values inferred from the theme.

A Ripple is a Material implementation of `Indication` that expresses different `Interaction`s by
drawing ripple animations and state layers.

A Ripple responds to `PressInteraction.Press` by starting a new animation, and responds to other
`Interaction`s by showing a fixed state layer with varying alpha values depending on the
`Interaction`.

`MaterialTheme` provides Ripples using `androidx.compose.foundation.LocalIndication`, so a Ripple
will be used as the default `Indication` inside components such as
`androidx.compose.foundation.clickable` and `androidx.compose.foundation.indication`, in addition
to Material provided components that use a Ripple as well.

You can also explicitly create a Ripple and provide it to custom components in order to change
the parameters from the default, such as to create an unbounded ripple with a fixed size.

To create a Ripple with a manually defined color that can change over time, see the other
`ripple` overload with a `ColorProducer` parameter. This will avoid unnecessary recompositions
when changing the color, and preserve existing ripple state when the color changes.

#### Parameters

| | |
| --- | --- |
| bounded | If true, ripples are clipped by the bounds of the target layout. Unbounded ripples always animate from the target layout center, bounded ripples animate from the touch position. |
| radius | the radius for the ripple. If `Dp.Unspecified` is provided then the size will be calculated based on the target layout size. |
| color | the color of the ripple. This color is usually the same color used by the text or iconography in the component. This color will then have `RippleDefaults.rippleAlpha` applied to calculate the final color used to draw the ripple. If `Color.Unspecified` is provided the color used will be `RippleDefaults.rippleColor` instead. |




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


```kotlin
fun ripple(
    color: ColorProducer,
    bounded: Boolean = true,
    radius: Dp = Dp.Unspecified,
): IndicationNodeFactory
```


Creates a Ripple using the provided values and values inferred from the theme.

A Ripple is a Material implementation of `Indication` that expresses different `Interaction`s by
drawing ripple animations and state layers.

A Ripple responds to `PressInteraction.Press` by starting a new ripple animation, and responds to
other `Interaction`s by showing a fixed state layer with varying alpha values depending on the
`Interaction`.

`MaterialTheme` provides Ripples using `androidx.compose.foundation.LocalIndication`, so a Ripple
will be used as the default `Indication` inside components such as
`androidx.compose.foundation.clickable` and `androidx.compose.foundation.indication`, in addition
to Material provided components that use a Ripple as well.

You can also explicitly create a Ripple and provide it to custom components in order to change
the parameters from the default, such as to create an unbounded ripple with a fixed size.

To create a Ripple with a static color, see the `ripple` overload with a `Color` parameter. This
overload is optimized for Ripples that have dynamic colors that change over time, to reduce
unnecessary recompositions.

#### Parameters

| | |
| --- | --- |
| color | the color of the ripple. This color is usually the same color used by the text or iconography in the component. This color will then have `RippleDefaults.rippleAlpha` applied to calculate the final color used to draw the ripple. If you are creating this `ColorProducer` outside of composition (where it will be automatically remembered), make sure that its instance is stable (such as by remembering the object that holds it), or remember the returned `ripple` object to make sure that ripple nodes are not being created each recomposition. |
| bounded | If true, ripples are clipped by the bounds of the target layout. Unbounded ripples always animate from the target layout center, bounded ripples animate from the touch position. |
| radius | the radius for the ripple. If `Dp.Unspecified` is provided then the size will be calculated based on the target layout size. |




