---
title: "Conditional: pushDown"
description: Scale an element down slightly while a condition is true.
---

Push down makes an element look pressed. Use it for a custom button that is held down, or for an item that is being dragged.

## Usage

The sample shrinks a button while the user holds it. `pressed` comes from your own state.

```kotlin
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import com.jantursky.kapow.ConditionalEffect
import com.jantursky.kapow.conditionalEffect

@Composable
fun HoldButton(pressed: Boolean) {
    Box(
        Modifier
            .size(96.dp)
            .background(Color.Gray, CircleShape)
            .conditionalEffect(pressed, ConditionalEffect.pushDown(scale = 0.9f)),
    )
}
```

## Parameters

| Parameter | Default | Description |
| --- | --- | --- |
| `scale` | `0.95f` | The size the element is drawn at while the condition holds, as a fraction of its normal size. Must be positive. |
| `damping` | `0.6f` | Damping ratio of the spring. Below 1 it overshoots when it springs back. |
| `stiffness` | `500f` | Stiffness of the spring. Must be positive. |
| `dim` | `0f` | How much the element dims while pressed, from 0 to 1. Under reduced motion a dim of 0 becomes a fifth. |
| `translation` | `0.dp` | How far the element moves down while pressed. |
| `origin` | `TransformOrigin.Center` | The point the element shrinks toward. |

## Reduced motion

The element keeps its size and dims slightly while the condition holds, so the pressed state still shows.

## Notes

- The element is scaled around `origin` (its center by default) and springs back to full size when the condition turns false.
- The scale is applied on the element's graphics layer. Layout keeps the real size, so neighbors don't move.

## Live example

<iframe class="live-example" src="https://kapow-demo.vercel.app/#conditional-push-down" title="Live example: conditional-push-down" loading="lazy" allow="autoplay"></iframe>