Command Palette

Search for a command to run...

Toggle Group

A set of two-state buttons that can be toggled on or off. Built on Base UI ToggleGroup primitive.

Installation

npx shadcn add toggle-group --registry https://ui.ch.sh/r

Usage

import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"

export default function Example() {
  return (
    <ToggleGroup>
      <ToggleGroupItem value="a">A</ToggleGroupItem>
      <ToggleGroupItem value="b">B</ToggleGroupItem>
      <ToggleGroupItem value="c">C</ToggleGroupItem>
    </ToggleGroup>
  )
}

Examples

Outline