Component · controls

Liquid glass switch

Binary setting.

Also called toggle switch

Four switch rows showing on, off, held thumb and disabled states in a glass panel over a procedural backdrop.
Four switch rows showing on, off, held thumb and disabled states in a glass panel over a procedural backdrop. (light)
Four switch rows showing on, off, held thumb and disabled states in a glass panel over a procedural backdrop.
Four switch rows showing on, off, held thumb and disabled states in a glass panel over a procedural backdrop. (dark)

Spec

Material
track: flat/tinted (off grey 30 %, on accent) · knob: white capsule, becomes a clear lens while dragged
Profile
convex knob
Geometry
track 46×26 (desktop) or 64×28 (iOS 26 style); knob height = track height − 4, knob width = 1.15–1.3 × knob height (capsule), inset 2 — scale with the track
Bezel (px)
knob h/2
Displacement (px)
0.4 × knob h/2 at rest, up to 0.5 while dragged
Blur (px)
0

Anatomy

  • track
  • knob
  • row label on the left

States

  • off
  • on
  • drag: knob grows 1.3× and turns to clear glass refracting the track
  • disabled 40 %

Rules

  • The knob is the only lens; the track is flat.