Skip to main content

Кнопки

Кнопка используется как триггер для выполнения определенного действия (или последовательности действий). Кнопка однозначно сообщает пользователю, что произойдет после нажатия на неё.

Когда используется

Основная кнопка (primary)

  • когда необходимо обозначить ключевое или страртовое действие на странице (например, начать заполнять форму)
  • в диалоговом окне, когда интерфейс предлагает совершить те или иные альтернативные действия

Второстепенная кнопка (secondary)

  • когда компонент не должен привлекать повышенного внимания или когда место на странице ограничено для размещения, а использование ссылки не подходит
  • когда возможны два варианта действия, одно из которых ключевое и выполнено основной кнопкой (например в диалоге модального окна)

Цвета кнопок

Контурные кнопки

Размеры кнопок

Кнопка с выпадающим списком

Кнопки с иконкой

Скругленные кнопки

Группа кнопок

Расположение кнопок

Кнопки в полях