Button
Buttons trigger an action, such as submitting a form, closing a dialog, or navigating to a new page.
This component was tested and signed off by Applause (external accessibility specialists).
- Always provide an
aria-labelfor buttons that contain only an icon. - The label is announced by screen readers and communicates the button’s purpose.
When you set the disabled attribute on the Button component, the aria-disabled attribute on the button element. This allows the button to receive focus so that it can be announced (as a disabled button) by a screen reader.
- Disabled buttons cannot receive focus and don’t explain why they can’t be used.
- Instead, consider keeping the button active and use validation or error messages to guide the user.
- Don’t Use Tooltips on Disabled Buttons. Tooltips are not reliably available across devices or assistive technologies.