Button Group

Install

npx shadcn@latest add https://plinth.dhrumilkherde.com/r/button-group.json

Usage

Works best with variant="outline" buttons. Corners and borders join automatically.

import { Button } from "@/components/ui/button";
import { ButtonGroup } from "@/components/ui/button-group";

<ButtonGroup>
  <Button variant="outline">Copy</Button>
  <Button variant="outline">Paste</Button>
</ButtonGroup>

With icons

Props

Plain div with role="group"; all styling is applied to the children. Accepts all div props.

Accessibility

• role="group" groups the buttons for assistive tech; add an aria-label describing the set when the context isn't obvious.
• Each button keeps its own focus stop and focus ring.