# Liquid glass switch: spec and references

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

Binary setting. Layer: controls.

Also called: toggle switch.

| Property | Value |
|---|---|
| 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.

## References

![Four switch rows showing on, off, held thumb and disabled states in a glass panel over a procedural backdrop.](https://meniscus.site/gallery/switch-light-studio.webp)

![Four switch rows showing on, off, held thumb and disabled states in a glass panel over a procedural backdrop.](https://meniscus.site/gallery/switch-dark-studio.webp)

## Use it with your assistant

This spec is what the Meniscus MCP server's `get_component_spec` tool returns for `switch`. 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