> For the complete documentation index, see [llms.txt](https://docs.sentre.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.sentre.io/design-pricinples/button.md).

# Button

### Usage

A button means an operation (or a series of operations). Clicking a button will trigger corresponding business logic.

In SenOS we provide 3 types of button:&#x20;

* Primary button: indicate the main action, one primary button at most in one section.&#x20;
* Default button: indicate a series of actions without.&#x20;
* Text button: used for the most secondary action.

![](/files/wd5TB9aiuXMRS0hlzYKw)

And 3 states:&#x20;

* Hover: used for the action of putting the mouse pointer on the button.&#x20;
* Pressed: used for button click action.&#x20;
* Disabled: when actions are not available.

![](/files/pO0MdbCQFjbh2EMGx5WD)

### Specs

We provide 3 sizes of button:&#x20;

* Large

![](/files/gSF89RTP01v37licVOzH)

* Default

![](/files/BfNb3rCsSgd8hg1zHn1m)

* Small

![](/files/o5ZrVmeS0mhIhkyB6oDY)

### Sample code

```
// Some code
```
