VisuallyHidden

VisuallyHidden is a common techinique used in web accessibility to hide content from the visual client, but keep it readable for screen readers.

#Installation

npm install reakit

Learn more in Get started.

#Usage

import { Button } from "reakit/Button";
import { VisuallyHidden } from "reakit/VisuallyHidden";
import UniversalAccess from "./UniversalAccess";

function Example() {
  return (
    <Button>
      <VisuallyHidden>Universal Access</VisuallyHidden> <UniversalAccess />
    </Button>
  );
}

#Accessibility

• VisuallyHidden has all the styles necessary to hide it from visual clients, but keep it for screen readers.

Learn more in Accessibility.

#Composition

• VisuallyHidden uses Role.

Learn more in Composition.

#Props

#VisuallyHidden

No props to show