Standard button styles in various semantic colors for different actions and states.

Bordered buttons with transparent backgrounds that emphasize actions without heavy visual weight.

Size variations for buttons to provide visual hierarchy and emphasis in your interface.

Enhanced buttons with icons to improve visual recognition and provide additional context.

Group related actions together for better visual organization and interface consistency.

Full-width buttons that span the entire width of the parent element for prominent actions.

Active buttons appear pressed, while disabled buttons prevent user interaction.

Soft-styled buttons with subtle color tones for a more gentle visual impact.

Toggle buttons switch between active and inactive states when clicked.

Fully rounded buttons with pill-shaped appearance for a modern, friendly UI.

Combines the softened colors with pill-shaped styling for an elegant, gentle look.

Buttons with loading spinners to indicate processing state to users.

Buttons with only icons for compact UI elements.

Combine button groups into toolbars for more complex components.

Stack buttons vertically using the vertical variant.

Adjust the size of button groups with size classes.