# Liquid glass stepper: spec and references

Source: https://meniscus.site/components/stepper · Updated 2026-09-27

Numeric input with −/+. Layer: controls.

Also called: number field, number input, counter.

| Property | Value |
|---|---|
| Material | regular |
| Profile | squircle |
| Geometry | one capsule 36–40 tall, ~120 wide: − | value | + |
| Bezel (px) | 18 |
| Displacement (px) | 25 |
| Blur (px) | 1 |

## Anatomy

- one shared glass capsule
- flat − and + glyph buttons
- centred value

## States

- rest
- press on − / +: small flat highlight
- focus ring on the capsule

## Rules

- The group is one lens; the − and + are flat inside it.

## References

![Two labelled quantity steppers in a glass panel, each a single capsule with flat minus and plus controls, over a procedural backdrop.](https://meniscus.site/gallery/stepper-light-studio.webp)

![Two labelled quantity steppers in a glass panel, each a single capsule with flat minus and plus glyphs around a centred value, over a zoomed night skyline and its waterline.](https://meniscus.site/gallery/stepper-dark-studio.webp)

## Use it with your assistant

This spec is what the Meniscus MCP server's `get_component_spec` tool returns for `stepper`. Materials, colours, light and composition rules that apply to every component are in the [liquid glass guide](https://meniscus.site/liquid-glass). Connect: `claude mcp add --transport http meniscus https://meniscus.site/mcp` — setup for every client: https://meniscus.site/docs