# Button Labels

Buttons can appear with text only, an icon and text, or an icon only. To create an accessible button, use the `lightning:button` or `lightning:buttonIcon` base components and set a textual label using the `label` attribute.

**Button with text only:**

```nolang
<lightning:button label="Search" 
                  onclick="{!c.doSomething}"/>

```

**Button with icon and text:**

```nolang
<lightning:button label="Download" iconName="utility:download" 
                  onclick="{!c.doSomething}"/>
```

`lightning:button` implements the [button](https://lightningdesignsystem.com/components/buttons/) blueprint in the Salesforce Lightning Design System (SLDS) and follows its accessibility guidelines.

**Button with icon only:**

```nolang
<lightning:buttonIcon iconName="utility:settings"
                      onclick="{!c.doSomething}
                      alternativeText="Settings"/>
```

The `alternativeText` attribute provides a text label that’s hidden from view and available to assistive technology.

`lightning:buttonIcon` implements the [button icon](https://lightningdesignsystem.com/components/button-icons/) blueprint in the SLDS and follows its accessibility guidelines.

This example shows the HTML generated by `lightning:buttonIcon`:

```nolang
<!-- Use assistive text to hide the label visually, but show it to screen readers -->
<button>
    ::before
    <span class="slds-assistive-text">Settings</span>
</button>
```

To support tooltip on desktop, include the `title` attribute in addition to the `label` or `alternativeText` attribute. The `title` attribute can be problematic for touch-only devices, keyboard navigation, and assistive technologies. Therefore, it must be used together with `label` or `alternativeText`.

:::note
Most ARIA states and properties are supported on these base components. For more information, see the reference documentation in the [Component Library](https://developer.salesforce.com/docs/component-library/bundle/lightning-button/documentation).
:::

Other button-based components include:

## lightning:buttonGroup

A group of buttons. This component implements the [button group](https://lightningdesignsystem.com/components/button-groups/) blueprint in the SLDS and follows its accessibility guidelines.

## lightning:buttonIconStateful

A button with an icon only that retains state. This component implements the [button icon](https://lightningdesignsystem.com/components/button-icons/) blueprint in the SLDS and follows its accessibility guidelines.

## lightning:buttonMenu

A dropdown menu with a list of actions or items. This component implements the [menu](https://lightningdesignsystem.com/components/menus/) blueprint in the SLDS and follows its accessibility guidelines.

## lightning:buttonStateful

A button that retains state. This component implements the [button](https://lightningdesignsystem.com/components/buttons/) blueprint in the SLDS and follows its accessibility guidelines.

**See Also**

- [Using Images and Icons](/docs/platform/aura-platform/guide/accessibility-img.md)
- [Creating a Form](/docs/platform/aura-platform/guide/lightning-base-form.md)
- [*Component Library*: lightning:button documentation](https://developer.salesforce.com/docs/component-library/bundle/lightning\:button)
