A
Accueil > Components > Checkbox

Checkbox

Case à cocher avec label, gestion des états et variants de taille.TagsuiExemples2StylesDisponibles
Default
Vous devez accepter les conditionsValidé
export const Default = () => (
<Box display="flex" flexDirection="column" gap={24}>
<Checkbox label="Non coché" />
<Checkbox label="Coché" checked />
<Checkbox label="Désactivé" disabled />
<Checkbox label="Coché désactivé" checked disabled />
<Checkbox label="Avec erreur" error="Vous devez accepter les conditions" />
<Checkbox label="Avec succès" success="Validé" />
</Box>
);
Variants
export const Variants = () => (
<Box display="flex" flexDirection="row" gap={16}>
<Checkbox label="Normal" />
<Checkbox label="Small" variant="small" />
</Box>
);
Alveole UI Kit — v1.8.4