@reach/visually-hidden

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

Last updated 3 years ago by chancestrickland .

MIT · Repository · Bugs · Original npm · Tarball · package.json

$ cnpm install @reach/visually-hidden

SYNC missed versions from official npm registry.

@reach/visually-hidden

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>
	);
}

Current Tags

0.18.0 ... latest (3 years ago)
0.4.0-beta.0 ... next (6 years ago)
0.18.0-pre.5 ... pre (3 years ago)

43 Versions

Maintainers (2)

mjackson

ryanflorence

Downloads

Today 0

This Week 1

This Month 10

Last Day 0

Last Week 10

Last Month 1

Dependencies (1)

@reach/polymorphic 0.18.0

Dev Dependencies (6)

Dependents (2)