Expand/Collapse Widget
Two accessible patterns are shown: a native <details> widget and a
button-controlled disclosure region.
Example 1: Native details/summary
What information is included?
This content is the controlled region. The native <details> element provides
built-in keyboard interaction and conveys state to assistive technologies.
- Keyboard: Tab to the summary, then Enter/Space to toggle.
- State: Open/closed state is exposed automatically.
- Focus: Visible focus indicator is provided.
Example 2: Button + controlled region
Add at least one recovery option so you can regain access if you forget your password.
- Email recovery
- Authenticator app
- Recovery codes (print and store securely)
Learn more about account recovery.
Keyboard: Tab to the button, press Enter/Space to toggle.