# Liquid glass tabs: spec and references

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

Switch between views or modes. Layer: controls.

Also called: segmented control, segmented, segment.

| Property | Value |
|---|---|
| Material | track: regular glass capsule · indicator: raised lens pill (or tint) |
| Profile | squircle |
| Geometry | track 32–36 tall capsule, inset 3; indicator radius = track radius − 3 |
| Bezel (px) | track 14–16 · indicator h/2 |
| Displacement (px) | track 20–25 · indicator 0.9–1.3 × its bezel |
| Blur (px) | 1–2 |

## Anatomy

- track
- sliding indicator
- flat labels

## States

- rest
- moving: indicator slides with a spring and stretches (morph) toward the target
- selected label weight 600

## Rules

- The indicator is the travelling lens; the track stays calm.
- Keep labels flat above both.

## References

![Segmented date-range and appearance controls with inset selected pills over a procedural backdrop.](https://meniscus.site/gallery/tabs-light-studio.webp)

![Segmented date-range and appearance controls with inset selected pills over a procedural backdrop.](https://meniscus.site/gallery/tabs-dark-studio.webp)

## Use it with your assistant

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