Skip to content

Visually Hidden ​

Loading...

Makes content accessible to assistive devices (screen readers) without displaying it visually on screen.

  • Tag: <flint-visually-hidden>
  • Class: FlintVisuallyHidden

Import ​

ts
import '@getufy/flint-ui'; // auto-registers all
// or
import { FlintVisuallyHidden } from '@getufy/flint-ui';

Usage ​

html
<flint-visually-hidden></flint-visually-hidden>

Properties ​

PropertyAttributeTypeDefaultDescription
notFocusablenot-focusablebooleanfalseWhen true, disables the focus-reveal behaviour. Useful for pure SR-only text (e.g. "opens in a new window") that should never become visible, even when a containing element is focused.

Slots ​

NameDescription
(default)The content to be visually hidden.