Skip to main content Skip to navigation Skip to search

To use the modal component import the component in your JavaScript.

import '@cds/core/modal/register.js';

Small Modal

Place holder text for the small modal example.

Cancel Ok

Size

Modal Example

Place holder text for the default sized modal example.

Cancel Ok

Large Modal Example

Place holder text for the large modal example.

Cancel Ok

Large

Extra Large Modal Example

Place holder text for the extra large modal example.

Cancel Ok

Theme

My Modal

Lorem Ipsum

Lorem Ipsum

Cancel Ok

Styles

Customizing Modal Styles

This example shows how modal visual styles can be changed and customized.

Click to Close Click to Confirm