Usage
import { Checkbox } from "lambda-ui-components";
<Checkbox />Checkbox
Checkbox component is a form element that allows users to select one or more options from a list of choices.
Playground
Experiment with all the properties of the Checkbox component in real time.
Properties
label
Sets the text shown next to the control.
color
Sets the color theme.
variant
Changes the visual style.
positionLabel
Adjusts the label position.
size
Adjusts the overall size.
radius
Controls corner rounding.
invalid
Marks the field as invalid.
required
Indicates that selection is required.
disabled
Prevents user interaction.
Custom Iconicon
Custom icon when the checkbox is checked.
Controlled
Use this when you need to control the checked state of the checkbox.
API Reference
Props
Prop | Default | Type |
|---|---|---|
size | "medium" | "tiny" | "small" | "medium" | "large" |
radius | "tiny" | "none" | "tiny" | "small" | "medium" | "large" | "full" |
color | "primary" | "neutral" | "primary" | "secondary" | "success" | "danger" | "warning" | "info" |
variant | "solid" | "solid" | "outline" | "soft" |
positionLabel | "right" | "left" | "right" | "top" | "bottom" |
invalid | false | boolean |
label | undefined | string |
disabled | false | boolean |
required | false | boolean |
defaultChecked | false | boolean |
checked | false | boolean |
onCheckedChange | undefined | (checked: boolean) => void |