@reach/visually-hidden

Render text that is announced to screen readers but visually hidden.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@reach/visually-hidden
5,535890.17.05 months ago4 years agoMinified + gzip package size for @reach/visually-hidden in KB

Readme

@reach/visually-hidden
Stable release MIT license
Docs | Source | Origin | Further reading
Provides text for screen readers that is visually hidden. It is the logical opposite of the aria-hidden attribute.
In the following example, screen readers will announce "Save" and will ignore the icon; the browser displays the icon and ignores the text.
import VisuallyHidden from "@reach/visually-hidden";

function Example() {
  return (
    <button>
      <VisuallyHidden>Save</VisuallyHidden>
      <span aria-hidden>💾</span>
    </button>
  );
}