Skip to main content

Borders

All borders are provided as custom properties. To access them the var() CSS function can be called with the border's name:

.some-example {
border: var(--theme-primary-bdr-1);
}
--theme-primary-bdr-1
--theme-primary-bdr-2
--theme-dynamic-bdr-1
--theme-dynamic-bdr-2
--theme-contrast-bdr-1
--theme-contrast-bdr-2
--theme-std-bdr-1
--theme-std-bdr-2
--theme-soft-bdr-1
--theme-soft-bdr-2
--theme-soft-dashed-bdr-1
--theme-soft-dashed-bdr-2
--theme-weak-bdr-1
--theme-weak-bdr-2
--theme-x-weak-bdr-1
--theme-x-weak-bdr-2
--theme-alarm-bdr-1
--theme-alarm-bdr-2
--theme-critical-bdr-1
--theme-critical-bdr-2
--theme-warning-bdr-1
--theme-warning-bdr-2
--theme-success-bdr-1
--theme-success-bdr-2
--theme-info-bdr-1
--theme-info-bdr-2
--theme-neutral-bdr-1
--theme-neutral-bdr-2