Liquid Glass

Apple's Liquid Glass effect for Android Jetpack Compose.

Demos

Playground app, Android 13 and above is required.

Music player demo that integrates liquid bottom tabs and adaptive luminance.

Library

The library is in alpha stage, every API may be changed, use it on your own risk.

Add to project

// settings.gradle.kts in root project
dependencyResolutionManagement {
    repositories {
        maven("https://jitpack.io")
    }
}

// build.gradle.kts in module
implementation("com.github.Kyant0:AndroidLiquidGlass:<version>")

Examples

val providerState = rememberLiquidGlassProviderState(
    backgroundColor = Color.White
)

// content behind the glass
Box(Modifier.liquidGlassProvider(providerState))

// glass
Box(
    Modifier.liquidGlass(
        providerState,
        GlassStyle(
            shape = RoundedCornerShape(16.dp),
            innerRefraction = InnerRefraction(
                height = RefractionHeight(8.dp),
                amount = RefractionAmount((-16).dp)
            ),
            material = GlassMaterial(
                blurRadius = 8.dp,
                brush = SolidColor(Color.White),
                alpha = 0.3f
            )
        )
    )
)

[Experimental] Dynamically adjusted tint by luminance behind the glass

val luminanceSampler = remember { ContinuousLuminanceSampler() }

liquidGlass(
    providerState,
    luminanceSampler = luminanceSampler
) {
    val luminance = luminanceSampler.luminance

    GlassStyle(
        // ...
        material = GlassMaterial(
            brush = SolidColor(Color.White), // or Color.Black
            alpha = luminance // write down your own logic here
        )
    )
}

See here for more details.

Limitations

The following case is not supported:

LiquidGlassProvider(providerState) {
    LiquidGlass(providerState) {}
}

Instead, you should rewrite it like this:

Box {
    LiquidGlassProvider(providerState) {}
    LiquidGlass(providerState) {}
}

Comparisons

Android device: Google Pixel 4 XL (the smallest width is adjusted to 440 dp to match the density of the iOS device)

iOS device: iPhone 16 Pro Max (simulator)

Test glass area size: 300 x 300, corner radius: 30

iOS	Android

Complete comparisons:

Special thanks

GlassExplorer

3.5 KiB Raw Blame History