Beta
Gradient Button Group
Segmented icon switcher with a sliding gradient selection pill driven by a shared layout animation.
Gradient Button Group
Segmented icon switcher with a sliding gradient selection pill driven by a shared layout animation.
When to use it
A switcher for two to five options where the selection should feel physical. Use it for view modes and filters, not for navigation that changes the page.
Install
Adds Gradient Button Group and its dependencies to your project through the shadcn CLI.
$ npx shadcn@latest add https://www.ssicevs.com/r/gradient-button-group.jsonProps · GradientButtonGroup
| Prop | Type | Default |
|---|---|---|
| items? | GradientButtonGroupItem[] | [] |
| value? | string | — |
| onValueChange? | (id: string) => void className?: string | () => {}, className, |
Generated from the component source. Run npm run props:extract after changing a signature.