The v-btn component replaces the standard html button with a material design theme and a multitude of options. Any color helper class can be used to alter the background or text color.

Go to api


Button dropdowns are regular selects with additional styling.

Toggle buttons are essentially styled radio or checkboxes, depending on the properties selected. This component is compatible with the v-toolbar component.

Icons can be used for the primary content of a button.

Floating buttons are round and usually contain an icon.

Using the loading prop, you can notify a user that there is processing taking place. The default behavior is to use a v-progress-circular component but this can be customized.

Buttons can be given different sizing options to fit a multitude of scenarios.

Outline buttons inherit their borders from the current color applied.

Rounded buttons behave the same as regular buttons but have rounded edges.

Block buttons extend the full available width.