Visually hidden

Copy page

Copy content for LLMs View as Markdown          Open in Claude Open in ChatGPT

import { VisuallyHidden } from "@kesko/components";

export default () => (
  <p>
    The text below is visually hidden but accessible to screen readers:
    <VisuallyHidden>This text is only visible to assistive technology.</VisuallyHidden>
  </p>
);

<p>
  The text below is visually hidden but accessible to screen readers:
  <span class="k-visually-hidden">This text is only visible to assistive technology.</span>
</p>