---
title: "blur"
description: "Draw content blurred with the specified radii. Note this effect is only supported on Android 12
and above. Attempts to use this Modifier on older Android versions will be ignored.

Usage of this API renders the corresponding composable into a separate graphics layer. Because
the blurred content renders a larger area by the blur radius, this layer is explicitly clipped to
the content bounds. It is recommended introduce additional space around the drawn content by the
specified blur radius to remain within the content bounds."
type: "modifier"
---

<div class='type'>Compose Modifier</div>

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


```kotlin
fun Modifier.blur(
    radiusX: Dp,
    radiusY: Dp,
    edgeTreatment: BlurredEdgeTreatment = BlurredEdgeTreatment.Rectangle,
): Modifier
```


Draw content blurred with the specified radii. Note this effect is only supported on Android 12
and above. Attempts to use this Modifier on older Android versions will be ignored.

Usage of this API renders the corresponding composable into a separate graphics layer. Because
the blurred content renders a larger area by the blur radius, this layer is explicitly clipped to
the content bounds. It is recommended introduce additional space around the drawn content by the
specified blur radius to remain within the content bounds.

#### Parameters

| | |
| --- | --- |
| radiusX | Radius of the blur along the x axis |
| radiusY | Radius of the blur along the y axis |
| edgeTreatment | Strategy used to render pixels outside of bounds of the original input |




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


```kotlin
fun Modifier.blur(
    radius: Dp,
    edgeTreatment: BlurredEdgeTreatment = BlurredEdgeTreatment.Rectangle,
) = blur(radius, radius, edgeTreatment)
```


Draw content blurred with the specified radii. Note this effect is only supported on Android 12
and above. Attempts to use this Modifier on older Android versions will be ignored.

Usage of this API renders the corresponding composable into a separate graphics layer. Because
the blurred content renders a larger area by the blur radius, this layer is explicitly clipped to
the content bounds. It is recommended introduce additional space around the drawn content by the
specified blur radius to remain within the content bounds.

#### Parameters

| | |
| --- | --- |
| radius | Radius of the blur along both the x and y axis |
| edgeTreatment | Strategy used to render pixels outside of bounds of the original input |




## Code Examples
### BlurSample
```kotlin
@Composable
fun BlurSample() {
    Box(
        Modifier.size(300.dp)
            // Blur content allowing the result to extend beyond the bounds of the original content
            .blur(30.dp, edgeTreatment = BlurredEdgeTreatment.Unbounded)
            .background(Color.Red, CircleShape)
    )
}
```
### ImageBlurSample
```kotlin
@Composable
fun ImageBlurSample() {
    Image(
        painter = painterResource(R.drawable.circus),
        contentDescription = "sample blurred image",
        // Blur content within the original bounds, clipping the result to a rounded rectangle
        modifier = Modifier.blur(30.dp, BlurredEdgeTreatment(RoundedCornerShape(5.dp))),
    )
}
```

