Modal Dialog Component (Example)

This page demonstrates a small accessible modal dialog component. The modal is closed by default. Use the "Open dialog" button below to open it.

Page content

Some page content that will be inert to assistive technologies when the modal is open.

Try opening the dialog and use Tab / Shift+Tab to cycle focus inside the dialog. Press Escape to close, or click outside the dialog on the overlay.