Checkbox Group

Groups multiple related checkboxes together under a single control, making it easy for users to select one or several choices.

428 B

•

Updated on August 21, 2026

Next.jsViteAstro

Installation

Bash

pnpm dlx shadcn@latest add @spaceui/primitives-checkbox-group

pnpm dlx shadcn@latest add @spaceui/primitives-checkbox-group

Usage

Code

import { Checkbox } from '@/components/ui/checkbox'
import { CheckboxGroup } from '@/components/ui/checkbox-group'

Code

<CheckboxGroup>
  <Label>
    <Checkbox defaultChecked />
    Next.js
  </Label>
  <Label>
    <Checkbox />
    Vite
  </Label>
  <Label>
    <Checkbox />
    Astro
  </Label>
</CheckboxGroup>

Features

Disabled Items

Checkbox group with individual disabled option items.

Next.jsViteAstro

API Reference

CheckboxGroup

Styled wrapper for CheckboxGroup from Base UI. Provides shared state management for a group of checkboxes with flex column layout.

Examples

Checkbox Collapsible

On This Page

Installation Usage Features Disabled Items API Reference CheckboxGroup Examples

@base-ui/react

pnpm dlx shadcn@latest add @spaceui/primitives-checkbox-group