Checkbox

Design.md

Changed from stock (Design.md §1.8, §3.0, §4.3): 20×20, radius 5, no fill of its own, a 3:1 control edge (hover darker), Primary when checked, the neutral strong fill when checked and disabled, a 2px Primary focus outline 2px outside.

npx shadcn@latest add @su/checkboxComponent tokens:--checkbox-radius--checkbox-size

States

Edges take the 3:1 control grey, Primary when on; the neutral strong fill when on and disabled (§1.8). Tab for the focus outline.

off
on
disabled
disabled on
invalid