Checkbox

A binary toggle input for selecting one or multiple options.

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

<Label>
	<Checkbox />
	Accept terms and conditions
</Label>

Installation

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

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

Import the Svelte component exports directly from the package.

import { Checkbox } from "coss-svelte";

Checkbox exposes a single component export for the current implementation.

A binary toggle input for selecting one or multiple options.

Prop	Type	Default	Description
`id`	`string`	-	ID forwarded to the form control.
`bind:checked`	`boolean`	`false`	Checked state for the control. Bind with `bind:checked` when supported.
`bind:indeterminate`	`boolean`	`false`	Displays the checkbox in an indeterminate state.
`label`	`string`	`""`	Accessible label or fallback visible label for the control.

bind:ref : HTMLElement | null