Menu

Component · controls

Liquid glass stepper

Numeric input with −/+.

Two labelled quantity steppers in a glass panel, each a single capsule with flat minus and plus controls, over a procedural backdrop.

Copy the prompt

Free

The rules, the spec, the glass code for Web and the checks, in one text.

Works in any AI that can write code.

Or connect your AI once
Material
regular
Profile
bevel
Bezel (px)
18
Displacement (px)
0.4 × bezel (7)
Blur (px)
1

Geometry. one capsule 36–40 tall, ~120 wide: − | value | +

Rules1
  • The group is one lens; the − and + are flat inside it.
Anatomy3
  • one shared glass capsule
  • flat − and + glyph buttons
  • centred value
States3
  • rest
  • press on − / +: small flat highlight
  • focus ring on the capsule

Questions

What material is a liquid glass stepper?

Regular material with a bevel edge profile, in the controls layer. Numeric input with −/+.

How big is a liquid glass stepper?

One capsule 36–40 tall, ~120 wide: − | value | +.

What bezel, displacement and blur does it use?

Bezel 18; displacement 0.4 × bezel (7); blur 1 (px).

Which states does a liquid glass stepper need?

Rest; press on − / +: small flat highlight; focus ring on the capsule.