by @alexstyl
✉️ Leave your feedback

← Back to Compose UI

blur

Modifier
in
Compose UI
. Since 1.1.0

Overview

Examples

Community Notes

@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)
    )
}
@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)))
    )
}

@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)
    )
}
@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)))
    )
}
Next ComponentAndroidView