Tokens

.sds_Modal

Component Tokens
Theme Tokens

--sds_modal_overlay_background

rgba(14, 14, 15, 0.24)

--sds_modal_header_background

--sds_theme_background_contrast sds-color(grey, 100)

--sds_modal_header_text

--sds_theme_text_contrast sds-color(white)

--sds_modal_header_button_background

--sds_theme_background_contrast sds-color(grey, 100)

--sds_modal_header_button_icon

--sds_theme_button_icon sds-color(grey, 70)

--sds_modal_header_button_interactive_background

--sds_theme_background_contrast_2 sds-color(grey, 90)

--sds_modal_header_button_hover_icon

--sds_theme_icon_light sds-color(white)

--sds_modal_body_background

--sds_theme_background_high sds-color(white)

--sds_modal_footer_background

--sds_theme_background sds-color(grey, 05)

--sds_modal_footer_border

--sds_theme_border sds-color(grey, 30)

Dark Theme Custom Tokens

This token is linked to the body and the attribute data-theme=''Dark"

Component Tokens
Theme Tokens

--sds_modal_overlay_background

rgba(14, 14, 15, 0.64)

--sds_modal_header_background

--sds_theme_background_low sds-color(grey, 100)

--sds_modal_header_text

--sds_theme_text sds-color(white)

--sds_modal_header_button_background

--sds_theme_background_low sds-color(grey, 100)

--sds_modal_header_button_icon

--sds_theme_background sds-color(grey, 90)

Last updated