Dialogs display information in a window or help a user focus on a task without navigating them away from the page. A user cannot perform other actions until the dialog is dismissed.

Sample component

Dialog

Standard modal dialog

A standard modal dialog contains text, and optionally some controls like links or buttons

Leave page

If you leave the page, any unsaved information will be lost.

Leave Cancel
Open modal dialog

Video modal dialog

Open video modal dialog

Demos

View a live version of this component and see how it can be customized.

View the <rh-dialog> demo in a new tab

Feedback

To give feedback about anything on this page, contact us.

Foundations

To learn how to use our other components in your designs, visit the Elements section.