Dialog is only supported in Safari 15.4 and newer. Use Modal component instead if you need to support older browsers.
Dialog Theme A dialog can apply its own color theme that is independent of the page. Important Notes: See the Theming System page for all color themes. Demo

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.

This is a dialog

Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque repellendus facere optio error quia animi nulla excepturi quaerat fugiat quam labore necessitatibus architecto praesentium inventore adipisci, maxime natus ut eius.
Twig
{% include '@bolt-components-dialog/dialog.twig' with {
  content: content,
  attributes: {
    class: 't-bolt-navy',
    id: 'dialog-theme-1',
  },
} only %}
HTML
Not available in plain HTML. Please use Twig.