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

Small Modal

Place holder text for the small modal example.

Cancel Ok

DefaultSize

Modal Example

Place holder text for the default sized modal example.

Cancel Ok

Large

Large Modal Example

Place holder text for the large modal example.

Cancel Ok

ExtraLarge

Extra Large Modal Example

Place holder text for the extra large modal example.

Cancel Ok

DarkTheme

My Modal

Lorem Ipsum

Lorem Ipsum

Cancel Ok

CustomStyles

Customizing Modal Styles

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

Click to Close Click to Confirm