Looking for Reakit's successor?Visit Ariakit
Skip to main content


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


npm install reakit

Learn more in Get started.


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

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


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

Learn more in Accessibility.


  • VisuallyHidden uses Role.

Learn more in Composition.



No props to show

Powered by Vercel

Released under the MIT License

Copyright © 2017-2023 Diego Haz