A versatile button component with multiple variants, sizes, and states. Perfect for user interactions and actions.
The simplest form of a button with the default variant and size.
Buttons support four different variants for various semantic meanings.
Choose from three size options depending on the context.
Buttons can be disabled to prevent user interaction.
Use disabled state with loading text to indicate async operations.
Buttons can include icons for better visual communication.
Use buttons for form submission and reset actions.
Use icons alone for compact button interfaces or toolbars.
Full-width buttons for prominent call-to-action sections.
Compact button controls for quantity selectors and similar patterns.