Магазин

Для бизнеса

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.

Buttons in their simplest form contain uppercase text, a slight elevation, hover effect, and a ripple effect on click.

Options

Select your desired component from below and see the available props, slots, events and functions.

Below is a collection of simple to complex examples.

Плоские кнопки не имеют теней и фона. Только при наведении подсвечивается контейнер для показанной кнопки.

Обычные кнопки имеют тень, которая увеличивается при нажатии. Это стиль по умолчанию.

Нажатые кнопки по-прежнему сохраняют свой цвет фона, но не имеют тени.

Выпадающие кнопки являются стандартным выбором с дополнительным стилем.

Иконки могут использоваться для основного содержимого кнопки.

Floating buttons are rounded and usually contain an icon.

Кнопкам можно задавать различные размеры.

Outlined buttons inherit their borders from the current color applied.

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

Tile buttons behave the same as regular buttons but have no border radius.

Кнопки данного типа используют всю доступную ширину.

Используя загрузку, вы можете уведомить пользователя о том, что происходит обработка. По умолчанию используется компонент v-progress-circle, но это можно настроить.

Ready for more? Continue reading with:

Caught a mistake or want to contribute to the documentation? Edit this page on GitHub!