Component · controls over content (the live camera)
Liquid glass shutter
The camera's capture cluster: shutter, last capture, camera flip, zoom and mode.
- Material
- lens (clear) over a local dim
- Profile
- convex (ring, side buttons) · bevel (zoom and mode capsules, their pills)
- Bezel (px)
- ring: = radius (40)
- Displacement (px)
- 0.5 × radius (20)
- Blur (px)
- 0.5–1
Geometry. shutter: a clear ring 76–84 (80) around a solid white disc 60–66 (64; red #E5484D in video); side buttons 48–56 circles (52) 48–56 px either side of the ring, the thumbnail a flat 42 photo circle inside one; above them a mode capsule 32–36 tall (36) with Photo / Video, and above that a zoom capsule 36–40 tall (40) with three flat chips 32–36 wide (0.5, 1×, 2), each track inset 4 with a lens pill on the selected option; 12–16 px between rows; labels 12.5–13.5 weight 600–700, white
Rules4
- Clear glass over a live camera needs a local dim behind the cluster: raise it until the white labels reach 4.5:1 over the brightest frame (§10, at least 35 %).
- The disc is solid, not glass; the ring is the lens around it.
- Chips and mode labels are flat; only the selected pill in each track is a lens (the moving indicator).
- Glyphs and labels are white in both themes; the cluster keeps ≥ 8 px between its separate bodies.
Anatomy6
- a local dim behind the whole cluster: black 50–55 % over bright scenes (30 % over dark), held at full strength across the whole cluster and feathered only outside it; raise it until every white label passes 4.5:1, and give a top row of controls its own dim
- zoom capsule: flat chips, a lens pill on the selected one, which shows its unit (1×)
- mode capsule: Photo / Video, a lens pill on the current mode
- shutter: a clear lens ring around a solid disc
- thumbnail button: a flat photo circle inside a lens
- flip button: a lens with a flat white glyph
States4
- rest
- press: the disc shrinks to 0.86 while the ring grows 1.05 and its rim brightens
- video: the disc turns red; recording: it morphs into a 28 px rounded square
- zoom or mode change: the pill slides with a spring
Questions
What material is a liquid glass shutter?
Lens (clear) over a local dim material with a convex (ring, side buttons) · bevel (zoom and mode capsules, their pills) edge profile, in the controls over content (the live camera) layer. The camera's capture cluster: shutter, last capture, camera flip, zoom and mode.
How big is a liquid glass shutter?
Shutter: a clear ring 76–84 (80) around a solid white disc 60–66 (64; red #E5484D in video); side buttons 48–56 circles (52) 48–56 px either side of the ring, the thumbnail a flat 42 photo circle inside one; above them a mode capsule 32–36 tall (36) with Photo / Video, and above that a zoom capsule 36–40 tall (40) with three flat chips 32–36 wide (0.5, 1×, 2), each track inset 4 with a lens pill on the selected option; 12–16 px between rows; labels 12.5–13.5 weight 600–700, white.
What bezel, displacement and blur does it use?
Bezel ring: = radius (40); displacement 0.5 × radius (20); blur 0.5–1 (px).
Which states does a liquid glass shutter need?
Rest; press: the disc shrinks to 0.86 while the ring grows 1.05 and its rim brightens; video: the disc turns red; recording: it morphs into a 28 px rounded square; zoom or mode change: the pill slides with a spring.

