Design Accessible Modals
Components · modals, accessibility
Updated 2026-07-28
- Modals interrupt the user's current task, so they require extra care.
- A modal should:
- Move focus inside.
- Explain its purpose.
- Provide clear actions.
- Support:
- Escape to close when appropriate.
- Keyboard navigation.
- Screen reader announcements.
- Avoid:
- Multiple stacked modals.
- Unexpected popups.
- Blocking important information.
- A modal should feel like a focused conversation, not an interruption.
Related guides
UX Handbook