Visually Hidden

Hides content while keeping it available to assistive technology

Focusable Elements

<vwc-button label="Visually hidden button ->" onclick="focusHiddenButton()"></vwc-button>
<vwc-visually-hidden>
  <vwc-button label="Only visible when focused"></vwc-button>
</vwc-visually-hidden>

<script>
  function focusHiddenButton() {
    document.querySelector('vwc-visually-hidden > vwc-button').focus();
  }
</script>