VisuallyHidden

The VisuallyHidden component is a utility used in web development to enhance accessibility by hiding content visually while keeping it accessible to screen readers. This component is essential for providing additional context or information to users relying on assistive technologies without cluttering the visual interface. It is commonly used for elements like labels, instructions, or descriptions that need to be read by screen readers but should not be visible on the screen.

Source

Props

import { VisuallyHidden } from 'welcome-ui/VisuallyHidden'

const Example = () => {
  return (
    <button>
      Submit
      <VisuallyHidden>Hidden</VisuallyHidden>
    </button>
  )
}

export default Example

Examples

Tag Alert