Liquid¶

Liquid unlocks a new capability for Compose Multiplatform: letting modifier nodes sample and manipulate the pixels behind them. By tagging nodes as liquefiable, you can create effects that distort the underlying content in a way that isn't normally possible with Compose's rendering pipeline.

This enables Liquid Glass-style effects like dynamic frosted glass, lenses, and other distortions. Powered by RuntimeShaders/RuntimeEffects and ModifierNodeElement APIs, it delivers GPU-accelerated visuals to your Compose UI.

Quick Start¶

Add mavenCentral() and Liquid to your list of repositories and dependencies:

repositories {
  mavenCentral()
}

dependencies {
  implementation("io.github.fletchmckee.liquid:liquid:1.0.0")
}

Below is a simple implementation:

@Composable
fun LiquidScreen(
  modifier: Modifier = Modifier,
  liquidState: LiquidState = rememberLiquidState(),
) = Box(modifier) {
  // Content layer for `liquefiable` source nodes
  ImageBackground(
    Modifier
      .fillMaxSize()
      .liquefiable(liquidState),
  )
  // Control layer for `liquid` effect nodes
  LiquidButton(
    Modifier
      .align(Alignment.TopStart)
      .liquid(liquidState),
  )
}

Acknowledgements¶

• The Haze library developed by Chris Banes was a large source of inspiration, particularly for the use of content and effect Modifier nodes.
• The original liquid lens effect was inspired by ShaderToy user 4eckme with their Liquid Glass example.
• The current spherical liquid lens effect was inspired by GitHub user Kyant0 with their own AndroidLiquidGlass library.
• The dispersion effect was inspired by ShaderToy user PuZo with their Chromatic Aberration example.
• Tobias Bjørkli @tobiasbjorkli for the northern_lights.webp
• Vlad Alexandru Popa @vladalex94 for the ny_city.webp.
• Romain Guy romainguy.dev for the dotonbori.webp.
• Efrem Efre @efrem-efre-2786187 for the prague_clock.webp.

License¶

Copyright 2025 Colin McKee

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

  https://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.