Warning! The Button component is deprecated. No new features will be added to this component. See each page under Components/Button section in the navigation to reference old documentation. For any new instances of a button please use the Button element. Please reference element doc instead.

Note: an icon-only button still is still required to have text, and that text is accessible through screen readers. It's just visually hidden.

This button's text is still accessible, it's just visually hidden. Xsmall icon-only button

This button's text is still accessible, it's just visually hidden. Small icon-only button

This button's text is still accessible, it's just visually hidden. Medium icon-only button

This button's text is still accessible, it's just visually hidden. Large icon-only button

This button's text is still accessible, it's just visually hidden. Xlarge icon-only button

Full border radius (circle icon-only button)

This button's text is still accessible, it's just visually hidden.

Examples with different icons

This button's text is still accessible, it's just visually hidden. This button's text is still accessible, it's just visually hidden. This button's text is still accessible, it's just visually hidden. This button's text is still accessible, it's just visually hidden. This button's text is still accessible, it's just visually hidden. This button's text is still accessible, it's just visually hidden.