Build faster with Premium Chakra UI Components 💎

Learn more
Skip to Content
DocsEnterpriseBlogShowcase
Sponsor

Visually Hidden

Used to hide content visually but keep it accessible to screen readers.

Usage

import { VisuallyHidden } from "@chakra-ui/react"
<VisuallyHidden>Hidden content</VisuallyHidden>

Examples

Input

Using the asChild prop, you can pass a child element to the VisuallyHidden component.

The input is hidden

Previous

Show

Next

Overview