Tailwind CSS Button Group - React

Use our ButtonGroup based on Tailwind CSS for actions.

ButtonGroup is an essential element of web design. Basically, ButtonGroup is stack of buttons. They help users navigate our websites or apps and drive them to a particular action.

See below our ButtonGroup example that you can use in your Tailwind CSS and React project. The example also comes in different styles and colors, so you can adapt it easily to your needs.



Button Group Variants

The ButtonGroup component comes with 4 different variants that you can change it using the variant prop.


Button Group Sizes

The ButtonGroup component comes with 3 different sizes that you can change it using the size prop.


Button Group Colors

The ButtonGroup component comes with 19 different colors that you can change it using the color prop.


Block Level Button Group

A ButtonGroup could be a block level component as well that get's all the available space in a row. You can render a ButtonGroup as a block level element using the fullWidth prop.


Button Group Ripple Effect

You can turn on/off the ripple effect for the ButtonGroup component using the ripple prop.

Edit this page on Github