# Button (lv_button) (/widgets/button)



Overview [#overview]

Buttons have no new features compared to the [base widget](/widgets/base_widget).
They are useful for semantic purposes and have slightly different default settings.

Buttons, by default, differ from the Base Widget in the following ways:

* Not scrollable
* Added to the default group
* Default height and width set to <ApiLink name="LV_SIZE_CONTENT" />

Parts and Styles [#parts-and-styles]

* <ApiLink name="LV_PART_MAIN" /> The background of the button; uses the [typical
  background style properties](/common-widget-features/styles/overview).

Usage [#usage]

There are no new features compared to [Base Widget](/widgets/base_widget).

Events [#events]

* <ApiLink name="LV_EVENT_VALUE_CHANGED" /> when the <ApiLink name="LV_OBJ_FLAG_CHECKABLE" /> flag is
  enabled and the Widget is clicked. The event happens on transition
  to/from the checked state.

<Callout type="info" title="Further Reading">
  Learn more about [Events](/common-widget-features/events) emitted by all Widgets.

  Learn more about [events](/common-widget-features/events).
</Callout>

Keys [#keys]

Note that the state of <ApiLink name="LV_KEY_ENTER" /> is translated to
<ApiLink name="LV_EVENT_PRESSED" />, <ApiLink name="LV_EVENT_PRESSING" />
and <ApiLink name="LV_EVENT_RELEASED" /> etc.

<Callout type="info" title="Further Reading">
  Learn more about [Keys](/main-modules/indev/keypad).
</Callout>

Examples [#examples]

Simple Buttons [#simple-buttons]

<LvglExample name="lv_example_button_1" path="widgets/button/lv_example_button_1" />

Styling buttons [#styling-buttons]

<LvglExample name="lv_example_button_2" path="widgets/button/lv_example_button_2" />

Gummy button [#gummy-button]

<LvglExample name="lv_example_button_3" path="widgets/button/lv_example_button_3" />

API [#api]