Checkbox Group

A collection of related checkboxes with group-level control.

<script lang="ts">
import { Checkbox, CheckboxGroup, Label } from "coss-svelte";
</script>

<CheckboxGroup aria-label="Select frameworks" value={["next"]}>
	<Label><Checkbox value="next" /> Next.js</Label>
	<Label><Checkbox value="vite" /> Vite</Label>
	<Label><Checkbox value="astro" /> Astro</Label>
</CheckboxGroup>

Installation

Install the component package, shared coss-svelte theme, and Bits UI peer.

npm install coss-svelte @coss-svelte/theme bits-ui

Usage

Import the Svelte component exports directly from the package.

import { CheckboxGroup } from "coss-svelte";

Anatomy

Checkbox Group exposes a single component export for the current implementation.

API Reference

CheckboxGroup

A collection of related checkboxes with group-level control.

Prop	Type	Default	Description
`label`	`string`	`""`	Accessible label or fallback visible label for the control.

children : Snippet<[]>bind:ref : HTMLElement | null

Inherits from Bits UI Checkbox.Group.

Implementation Details

Status: Stable
Foundation: custom
Category: Toggle & Choice
Particles: 5