# Button

A clickable element which communicates that users can trigger an action.

Tabs: [Guidelines](/components/web/button/button.guidelines.md) · [Code](/components/web/button/button.code.md) · [Content](/components/web/button/button.content.md)

## Keep labels short and direct

Use 1–3 words that clearly describe the action. Write labels in plain language so users can easily understand what will happen next. Avoid combining or stacking actions.

**Do:**

SaveSend request

**Don't:**

Click here to save your changesSubmit and continue to next step

## Lead with a familiar verb

Use common verbs that reflect user goals. The action should feel straightforward and achievable.

Avoid technical terms like *Enable*, *Verify*, *Initialise*, *Generate*, or *Execute*.

Labels should generally follow a **verb + object** pattern (e.g. *“Add receipt”*, *“Upload file”*).

Short confirmations such as *“Done”*, *“Next”*, or *“Back”* are exceptions — keep them consistent across the product.

**Do:**

Upload fileAdd receiptDone

**Don't:**

Execute uploadVerify documentInitialise process

## Always use sentence case

Only capitalise the first word (e.g. *“Send invoice”*).

Avoid title case, all caps, and punctuation.

Do not capitalise feature names — e.g. use *reimbursements*, not *Reimbursements*, unless referring to the product page itself. This avoids confusion and keeps the purpose clear.

**Do:**

Send invoiceAdd receiptView reimbursements

**Don't:**

Send InvoiceADD RECEIPT.View Reimbursements