Inputs

Segment Spring Lab

A single-select segmented control for tuning how stiff or loose the spring feels as its highlight glides between segments.

Settles in one smooth motion, no overshoot.

Using Segment Spring Lab

A single-select segmented control for tuning how stiff or loose the spring feels as its highlight glides between segments.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: springStiffness, springDamping, accentColor

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The preview and component description are public. Sign in with an authorized account to open the code, framework versions and installation panel.

Connect your agent

Nearby

2062Switch Spring LabInputsA bare on off switch for tuning how bouncy its thumb spring feels and how wide the thumb stretches under a press.

1933Checkbox motion labInputsA single oversized checkbox for tuning exactly how firmly it presses and how slowly its checkmark draws in.

2234Sliding highlight toggle groupInputsA row of icon buttons with a highlight panel that glides beneath the active one, or fades independently behind each active one in multi-select mode.

2045Sliding segment toggleInputsA single-select segmented control where a highlight pill glides beneath the active label whenever a different segment is chosen.

2002Multi select toggle rowInputsA row of independent toggle buttons, like text formatting options, where any number can stay pressed at once.

2297Addon Input GroupInputsA text field wrapped in one bordered shell that can carry a leading icon, a trailing button or text, and shares one focus ring across the whole group.