# Bootstrap 6 Button Group
> Bootstrap button group allows to group a series of buttons and power them with JavaScript.
## Examples
Wrap a series of buttons in `.btn-group`.
```html
```
> Button groups require an appropriate `role` attribute and explicit label to ensure assistive technologies like screen readers identify buttons as grouped and announce them. Use `role="group"` for button groups or `role="toolbar"` for button toolbars. Then use `aria-label` or `aria-labelledby` to label them.
### With links
These classes can also be added to groups of links, as an alternative to the [`.nav` navigation components](https://coreui.io/bootstrap/docs/components/nav/).
```html
```
### Dividers
Add a divider between buttons by adding the `.btn-group-divider` class to the `.btn-group`. Most useful when used with buttons that have the same theme color and a solid fill.
```html
```
Works with vertical button groups, too.
```html
```
## Theme variants
Use the `.theme-{color}` classes to apply a theme color to a set of buttons.
```html
```
You can mix and match button variants in a button group.
```html
```
## Style variants
All button styles are supported in button groups. Mix and match with the `.btn-group-divider` class to add dividers between some styles or just use the button borders in others.
```html
```
```html
```
```html
```
## Toggle buttons
### Checkbox
Checkbox toggle buttons can be grouped together. Any or all of the buttons can be checked.
```html
```
### Radio
By design, radio toggle button groups can only have one button checked at a time.
```html
```
## Button toolbar
Combine sets of button groups into button toolbars for more complex components. Use utility classes as needed to space out groups, buttons, and more.
```html
```
Feel free to mix input groups with button groups in your toolbars.
```html
@
@
```
## Sizing
Instead of applying button sizing classes to every button in a group, just add `.btn-group-*` to each `.btn-group`, including each one when nesting multiple groups. The sizes are `.btn-group-xs`, `.btn-group-sm` and `.btn-group-lg` — the same ladder the buttons themselves use.
```html
```
## Nesting
Place a `.btn-group` within another `.btn-group` when you want menus mixed with a series of buttons.
```html
```
## Vertical variation
Make a set of buttons appear vertically stacked rather than horizontally. **Split button menus are not supported here.**
```html