The lens and its style

One widget, one flat style object: shape, lights, fill and refraction.

LiquidGlassLens({
  LiquidGlassStyle style = const LiquidGlassStyle(),
  bool visibility = true,
  LiquidGlassTouch? touch,
  bool? useImpellerBackdrop,
  Widget? child,
})

Size comes from layout, never from the lens. The child is clipped to the glass shape. visibility: false switches the glass off instantly — no backdrop cost, no child — so it is the cheap way to hide a lens you will show again.

LiquidGlassStyle#

Everything about how a lens looks lives in one object, and every field sits directly on it — no nested groups — so changing one facet is one copyWith(...). merge(other) is there for theme and override patterns, and the components describe their glass with the same object.

LiquidGlassStyle({
  LiquidGlassShape? shape,        // null → the consumer's default outline
  LiquidGlassLight? specular,     // null → the consumer's default highlight
  LiquidGlassLight? glow,         // null → the consumer's default (none on a lens)
  double refractionIndex = 1.1,
  double refractionWidth = 12,
  double magnification = 1.0,
  double dispersion = 0,
  double saturation = 1.0,
  double blur = 0,
  Color color = const Color(0x00000000),
  LiquidGlassShadow? shadow,
  LiquidGlassAdaptivity? adaptivity,
  bool liteGlass = false,
})

// Change one facet, keep the rest.
final frosted = style.copyWith(blur: 4, color: const Color(0x22FFFFFF));

Shape#

A shape is the outline and nothing else: all three take cornerRadius (default 50) and clipQuality, and copyWith(...) changes either. The border is no longer part of the shape — it is the style's two lights, below.

Fill#

Refraction#

One model, two numbers: the edge bends what is behind it by refractionIndex over a band refractionWidth wide.

The border: two lights#

The rim is two LiquidGlassLights on the style. The specular is the highlight: a crisp band that takes the colour of the backdrop seen through the edge, brightened. The glow is the softer, wider side band that fills the sides the specular leaves dark. Each light draws a pair of opposing arcs on its own axis.

LiquidGlassLens(
  style: const LiquidGlassStyle(
    shape: LiquidGlassShape.squircle(cornerRadius: 36),
    specular: LiquidGlassLight.specular(thickness: 5, angle: 39),
    glow: LiquidGlassLight.glow(angle: 129, intensity: 0.8),
    refractionIndex: 1.02,
    refractionWidth: 24,
    color: Color(0x22FFFFFF),
    blur: 3,
  ),
  child: child,
)

Coming from 4.x#

5.0.0 flattened the style and replaced the border types with the two lights. The common moves:

Every parameter#

The tables above are the ones worth learning. The complete list — every field, every default, straight from the source — is generated on the lens API page.