Skip to content
BigBang

Popular

    ↑↓Navigate↵OpenEscClose
    TR

    Components

    Checkbox

    A box that is checked or not, with its label beside it.

    Storybook
    Storybook
    Source
    Source

    Added

    • First version: a labelled checkbox on Base UI Checkbox.
    • label, description, checked, defaultChecked, onCheckedChange, indeterminate, invalid, required, disabled, name, value, parent.
    • The mark appears with motion.selectionMark.
    • The checkbox-size and checkbox-radius component tokens.

    Changed

    • The unchecked box uses the input border (border-input).
    • Focus shows as a 2 px outer focus outline with a 2 px gap (focus-outline).