/
Getting Started
Overview
Design Tokens
Overview
Color
Typography
Unit
Radius
Shadow
Viewport
Components
Accordion
Alert
Avatar
Badge
Breadcrumbs
Button
Card
Carousel
Checkbox
Divider
Dropdown menu
Link
Loader
Menu item
Modal
Overlay
Popover
Progress
Radio
Select
Switch
Tabs
Text Area
Text Field
Toast
Tooltip
Utilities
Action Bar
Actionable
Aspect ratio
Backdrop
Container
Dismissible
Form control
Hidden
Hidden visually
Icon
Image
Text
Theme provider
View
Hooks
useElementId
useFormControl
useRTL
useScrollLock
useTheme
useToggle

Hidden visually

Utility that provides the content to assistive technologies while hiding it from the screen.
Import
import { HiddenVisually } from "@uicapsule/components";
import type { HiddenVisuallyProps } from "@uicapsule/components";
Storybook
Hidden visually stories
Hides content while keeping screen readers announcements


Usage

HiddenVisually will hide everything passed as children from the screen but will still read that content when navigating with a screen reader. This way, you can add extra information for screen reader users.

<HiddenVisually>Available only to screen readers</HiddenVisually>
Previous
Hidden
Next
Icon