Fieldbook
Sign in

Inputs

Stacked option checklist

A stacked list of labeled checkboxes that share one combined selection, with a running count of how many items are chosen.

Using Stacked option checklist

A stacked list of labeled checkboxes that share one combined selection, with a running count of how many items are chosen.

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: accentColor, gap, orientation

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 code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

Drawn check checkbox
2343Drawn check checkboxInputsA checkbox whose check mark draws itself stroke by stroke as the box fills with a solid accent color.
Select All Checklist
1982Select All ChecklistInputsA parent checkbox that shows a dash when only some of its child items are checked, and a checkmark once every item is.
Springing radio group
2053Springing radio groupInputsA radio group where the chosen dot springs up from nothing with a small overshoot while the previous one shrinks away, and every ring grows slightly under the pointer.
Addon Input Group
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.
Auto Grow Textarea
2792Auto Grow TextareaInputsA multi-line text field that grows taller as the person types more, instead of scrolling inside a fixed box.
Check draw toggle
1932Check draw toggleInputsA square checkbox whose checkmark draws itself stroke by stroke when checked, with a soft press and hover scale.