DUButtonGroup
ElementsGroups related buttons with attached or spaced layouts.
import { DUButtonGroup, DUButton } from 'deri-ui';Live preview
typescript
<DUButtonGroup>
<DUButton>Left</DUButton>
<DUButton>Middle</DUButton>
<DUButton>Right</DUButton>
</DUButtonGroup>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| vertical | boolean | false | Stack vertically |
| attached | boolean | true | Join borders |
| className | string | — | Extra classes |
Usage
import { DUButtonGroup, DUButton } from 'deri-ui';
<DUButtonGroup>
<DUButton>Left</DUButton>
<DUButton>Middle</DUButton>
<DUButton>Right</DUButton>
</DUButtonGroup>Customize with className, radius, and Tailwind utilities. Theme tokens come from deri-ui/tailwind.preset.
Related
© 2026 Deri Ui. Developed by Deribew Shimelis. Copy and use the code freely in your projects.