Divide Color

Utilities for controlling the border color between an element's child items.

Vertical Dividers

Use d-divide-y{n} to create a divider between an element's child items.

Horizontal Dividers

Use d-divide-x{n} to create a divider between an element's child items.

Classes

Class
Output
d-divide-neutral-black
border-color: oklch(from var(--dt-color-neutral-black) l c h / var(--dco, alpha)) !important;
1
2
d-divide-neutral-transparent
border-color: oklch(from var(--dt-color-neutral-transparent) l c h / var(--dco, alpha)) !important;
1
2
d-divide-neutral-white
border-color: oklch(from var(--dt-color-neutral-white) l c h / var(--dco, alpha)) !important;
1
2
d-divide-accent
border-color: oklch(from var(--dt-color-border-accent) l c h / var(--dco, alpha)) !important;
1
2
d-divide-ai
border-image-source: var(--dt-color-border-ai) !important; border-image-slice: 1 !important;
1
2
d-divide-berry-50 Deprecated
border-color: oklch(from var(--dt-color-berry-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-100 Deprecated
border-color: oklch(from var(--dt-color-berry-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-200 Deprecated
border-color: oklch(from var(--dt-color-berry-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-300 Deprecated
border-color: oklch(from var(--dt-color-berry-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-400 Deprecated
border-color: oklch(from var(--dt-color-berry-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-500 Deprecated
border-color: oklch(from var(--dt-color-berry-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-600 Deprecated
border-color: oklch(from var(--dt-color-berry-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-700 Deprecated
border-color: oklch(from var(--dt-color-berry-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-800 Deprecated
border-color: oklch(from var(--dt-color-berry-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-900 Deprecated
border-color: oklch(from var(--dt-color-berry-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-950 Deprecated
border-color: oklch(from var(--dt-color-berry-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-berry-1000 Deprecated
border-color: oklch(from var(--dt-color-berry-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-50 Deprecated
border-color: oklch(from var(--dt-color-black-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-100 Deprecated
border-color: oklch(from var(--dt-color-black-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-150 Deprecated
border-color: oklch(from var(--dt-color-black-150) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-200 Deprecated
border-color: oklch(from var(--dt-color-black-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-250 Deprecated
border-color: oklch(from var(--dt-color-black-250) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-300 Deprecated
border-color: oklch(from var(--dt-color-black-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-350 Deprecated
border-color: oklch(from var(--dt-color-black-350) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-400 Deprecated
border-color: oklch(from var(--dt-color-black-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-450 Deprecated
border-color: oklch(from var(--dt-color-black-450) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-500 Deprecated
border-color: oklch(from var(--dt-color-black-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-550 Deprecated
border-color: oklch(from var(--dt-color-black-550) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-600 Deprecated
border-color: oklch(from var(--dt-color-black-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-650 Deprecated
border-color: oklch(from var(--dt-color-black-650) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-700 Deprecated
border-color: oklch(from var(--dt-color-black-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-750 Deprecated
border-color: oklch(from var(--dt-color-black-750) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-800 Deprecated
border-color: oklch(from var(--dt-color-black-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-850 Deprecated
border-color: oklch(from var(--dt-color-black-850) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-900 Deprecated
border-color: oklch(from var(--dt-color-black-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-950 Deprecated
border-color: oklch(from var(--dt-color-black-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-black-1000 Deprecated
border-color: oklch(from var(--dt-color-black-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-50 Deprecated
border-color: oklch(from var(--dt-color-blue-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-100 Deprecated
border-color: oklch(from var(--dt-color-blue-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-200 Deprecated
border-color: oklch(from var(--dt-color-blue-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-300 Deprecated
border-color: oklch(from var(--dt-color-blue-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-400 Deprecated
border-color: oklch(from var(--dt-color-blue-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-500 Deprecated
border-color: oklch(from var(--dt-color-blue-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-600 Deprecated
border-color: oklch(from var(--dt-color-blue-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-700 Deprecated
border-color: oklch(from var(--dt-color-blue-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-800 Deprecated
border-color: oklch(from var(--dt-color-blue-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-900 Deprecated
border-color: oklch(from var(--dt-color-blue-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-950 Deprecated
border-color: oklch(from var(--dt-color-blue-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-blue-1000 Deprecated
border-color: oklch(from var(--dt-color-blue-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-bold
border-color: oklch(from var(--dt-color-border-bold) l c h / var(--dco, alpha)) !important;
1
2
d-divide-bold-inverted Deprecated
border-color: oklch(from var(--dt-color-border-bold-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-brand
border-color: oklch(from var(--dt-color-border-brand) l c h / var(--dco, alpha)) !important;
1
2
d-divide-brand-inverted Deprecated
border-color: oklch(from var(--dt-color-border-brand-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-brand-strong
border-color: oklch(from var(--dt-color-border-brand-strong) l c h / var(--dco, alpha)) !important;
1
2
d-divide-brand-strong-inverted Deprecated
border-color: oklch(from var(--dt-color-border-brand-strong-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-brand-subtle
border-color: oklch(from var(--dt-color-border-brand-subtle) l c h / var(--dco, alpha)) !important;
1
2
d-divide-brand-subtle-inverted Deprecated
border-color: oklch(from var(--dt-color-border-brand-subtle-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-50 Deprecated
border-color: oklch(from var(--dt-color-coral-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-100 Deprecated
border-color: oklch(from var(--dt-color-coral-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-200 Deprecated
border-color: oklch(from var(--dt-color-coral-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-300 Deprecated
border-color: oklch(from var(--dt-color-coral-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-400 Deprecated
border-color: oklch(from var(--dt-color-coral-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-500 Deprecated
border-color: oklch(from var(--dt-color-coral-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-600 Deprecated
border-color: oklch(from var(--dt-color-coral-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-700 Deprecated
border-color: oklch(from var(--dt-color-coral-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-800 Deprecated
border-color: oklch(from var(--dt-color-coral-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-900 Deprecated
border-color: oklch(from var(--dt-color-coral-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-950 Deprecated
border-color: oklch(from var(--dt-color-coral-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-coral-1000 Deprecated
border-color: oklch(from var(--dt-color-coral-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-critical
border-color: oklch(from var(--dt-color-border-critical) l c h / var(--dco, alpha)) !important;
1
2
d-divide-critical-inverted Deprecated
border-color: oklch(from var(--dt-color-border-critical-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-critical-strong
border-color: oklch(from var(--dt-color-border-critical-strong) l c h / var(--dco, alpha)) !important;
1
2
d-divide-critical-strong-inverted Deprecated
border-color: oklch(from var(--dt-color-border-critical-strong-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-critical-subtle
border-color: oklch(from var(--dt-color-border-critical-subtle) l c h / var(--dco, alpha)) !important;
1
2
d-divide-critical-subtle-inverted Deprecated
border-color: oklch(from var(--dt-color-border-critical-subtle-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-default
border-color: oklch(from var(--dt-color-border-default) l c h / var(--dco, alpha)) !important;
1
2
d-divide-default-inverted Deprecated
border-color: oklch(from var(--dt-color-border-default-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-focus
border-color: oklch(from var(--dt-color-border-focus) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-50 Deprecated
border-color: oklch(from var(--dt-color-gold-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-100 Deprecated
border-color: oklch(from var(--dt-color-gold-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-200 Deprecated
border-color: oklch(from var(--dt-color-gold-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-300 Deprecated
border-color: oklch(from var(--dt-color-gold-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-400 Deprecated
border-color: oklch(from var(--dt-color-gold-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-500 Deprecated
border-color: oklch(from var(--dt-color-gold-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-600 Deprecated
border-color: oklch(from var(--dt-color-gold-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-700 Deprecated
border-color: oklch(from var(--dt-color-gold-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-800 Deprecated
border-color: oklch(from var(--dt-color-gold-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-900 Deprecated
border-color: oklch(from var(--dt-color-gold-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-950 Deprecated
border-color: oklch(from var(--dt-color-gold-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-gold-1000 Deprecated
border-color: oklch(from var(--dt-color-gold-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-50 Deprecated
border-color: oklch(from var(--dt-color-green-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-100 Deprecated
border-color: oklch(from var(--dt-color-green-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-200 Deprecated
border-color: oklch(from var(--dt-color-green-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-300 Deprecated
border-color: oklch(from var(--dt-color-green-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-400 Deprecated
border-color: oklch(from var(--dt-color-green-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-500 Deprecated
border-color: oklch(from var(--dt-color-green-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-600 Deprecated
border-color: oklch(from var(--dt-color-green-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-700 Deprecated
border-color: oklch(from var(--dt-color-green-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-800 Deprecated
border-color: oklch(from var(--dt-color-green-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-900 Deprecated
border-color: oklch(from var(--dt-color-green-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-950 Deprecated
border-color: oklch(from var(--dt-color-green-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-green-1000 Deprecated
border-color: oklch(from var(--dt-color-green-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-50 Deprecated
border-color: oklch(from var(--dt-color-indigo-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-100 Deprecated
border-color: oklch(from var(--dt-color-indigo-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-200 Deprecated
border-color: oklch(from var(--dt-color-indigo-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-300 Deprecated
border-color: oklch(from var(--dt-color-indigo-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-400 Deprecated
border-color: oklch(from var(--dt-color-indigo-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-500 Deprecated
border-color: oklch(from var(--dt-color-indigo-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-600 Deprecated
border-color: oklch(from var(--dt-color-indigo-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-700 Deprecated
border-color: oklch(from var(--dt-color-indigo-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-800 Deprecated
border-color: oklch(from var(--dt-color-indigo-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-900 Deprecated
border-color: oklch(from var(--dt-color-indigo-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-950 Deprecated
border-color: oklch(from var(--dt-color-indigo-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-indigo-1000 Deprecated
border-color: oklch(from var(--dt-color-indigo-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-info
border-color: oklch(from var(--dt-color-border-info) l c h / var(--dco, alpha)) !important;
1
2
d-divide-info-inverted Deprecated
border-color: oklch(from var(--dt-color-border-info-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-info-strong
border-color: oklch(from var(--dt-color-border-info-strong) l c h / var(--dco, alpha)) !important;
1
2
d-divide-info-strong-inverted Deprecated
border-color: oklch(from var(--dt-color-border-info-strong-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-info-subtle
border-color: oklch(from var(--dt-color-border-info-subtle) l c h / var(--dco, alpha)) !important;
1
2
d-divide-info-subtle-inverted Deprecated
border-color: oklch(from var(--dt-color-border-info-subtle-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-50 Deprecated
border-color: oklch(from var(--dt-color-magenta-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-100 Deprecated
border-color: oklch(from var(--dt-color-magenta-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-200 Deprecated
border-color: oklch(from var(--dt-color-magenta-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-300 Deprecated
border-color: oklch(from var(--dt-color-magenta-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-400 Deprecated
border-color: oklch(from var(--dt-color-magenta-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-500 Deprecated
border-color: oklch(from var(--dt-color-magenta-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-600 Deprecated
border-color: oklch(from var(--dt-color-magenta-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-700 Deprecated
border-color: oklch(from var(--dt-color-magenta-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-800 Deprecated
border-color: oklch(from var(--dt-color-magenta-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-900 Deprecated
border-color: oklch(from var(--dt-color-magenta-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-950 Deprecated
border-color: oklch(from var(--dt-color-magenta-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-magenta-1000 Deprecated
border-color: oklch(from var(--dt-color-magenta-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-moderate
border-color: oklch(from var(--dt-color-border-moderate) l c h / var(--dco, alpha)) !important;
1
2
d-divide-moderate-inverted Deprecated
border-color: oklch(from var(--dt-color-border-moderate-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-50 Deprecated
border-color: oklch(from var(--dt-color-olive-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-100 Deprecated
border-color: oklch(from var(--dt-color-olive-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-200 Deprecated
border-color: oklch(from var(--dt-color-olive-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-300 Deprecated
border-color: oklch(from var(--dt-color-olive-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-400 Deprecated
border-color: oklch(from var(--dt-color-olive-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-500 Deprecated
border-color: oklch(from var(--dt-color-olive-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-600 Deprecated
border-color: oklch(from var(--dt-color-olive-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-700 Deprecated
border-color: oklch(from var(--dt-color-olive-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-800 Deprecated
border-color: oklch(from var(--dt-color-olive-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-900 Deprecated
border-color: oklch(from var(--dt-color-olive-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-950 Deprecated
border-color: oklch(from var(--dt-color-olive-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-olive-1000 Deprecated
border-color: oklch(from var(--dt-color-olive-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-positive
border-color: oklch(from var(--dt-color-border-positive) l c h / var(--dco, alpha)) !important;
1
2
d-divide-positive-inverted Deprecated
border-color: oklch(from var(--dt-color-border-positive-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-positive-strong
border-color: oklch(from var(--dt-color-border-positive-strong) l c h / var(--dco, alpha)) !important;
1
2
d-divide-positive-strong-inverted Deprecated
border-color: oklch(from var(--dt-color-border-positive-strong-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-positive-subtle
border-color: oklch(from var(--dt-color-border-positive-subtle) l c h / var(--dco, alpha)) !important;
1
2
d-divide-positive-subtle-inverted Deprecated
border-color: oklch(from var(--dt-color-border-positive-subtle-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-50 Deprecated
border-color: oklch(from var(--dt-color-purple-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-100 Deprecated
border-color: oklch(from var(--dt-color-purple-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-200 Deprecated
border-color: oklch(from var(--dt-color-purple-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-300 Deprecated
border-color: oklch(from var(--dt-color-purple-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-400 Deprecated
border-color: oklch(from var(--dt-color-purple-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-500 Deprecated
border-color: oklch(from var(--dt-color-purple-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-600 Deprecated
border-color: oklch(from var(--dt-color-purple-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-700 Deprecated
border-color: oklch(from var(--dt-color-purple-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-800 Deprecated
border-color: oklch(from var(--dt-color-purple-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-900 Deprecated
border-color: oklch(from var(--dt-color-purple-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-950 Deprecated
border-color: oklch(from var(--dt-color-purple-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-purple-1000 Deprecated
border-color: oklch(from var(--dt-color-purple-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-50 Deprecated
border-color: oklch(from var(--dt-color-red-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-100 Deprecated
border-color: oklch(from var(--dt-color-red-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-200 Deprecated
border-color: oklch(from var(--dt-color-red-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-300 Deprecated
border-color: oklch(from var(--dt-color-red-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-400 Deprecated
border-color: oklch(from var(--dt-color-red-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-500 Deprecated
border-color: oklch(from var(--dt-color-red-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-600 Deprecated
border-color: oklch(from var(--dt-color-red-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-700 Deprecated
border-color: oklch(from var(--dt-color-red-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-800 Deprecated
border-color: oklch(from var(--dt-color-red-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-900 Deprecated
border-color: oklch(from var(--dt-color-red-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-950 Deprecated
border-color: oklch(from var(--dt-color-red-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-red-1000 Deprecated
border-color: oklch(from var(--dt-color-red-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-subtle
border-color: oklch(from var(--dt-color-border-subtle) l c h / var(--dco, alpha)) !important;
1
2
d-divide-subtle-inverted Deprecated
border-color: oklch(from var(--dt-color-border-subtle-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-success Deprecated
border-color: oklch(from var(--dt-color-border-success) l c h / var(--dco, alpha)) !important;
1
2
d-divide-success-inverted Deprecated
border-color: oklch(from var(--dt-color-border-success-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-success-strong Deprecated
border-color: oklch(from var(--dt-color-border-success-strong) l c h / var(--dco, alpha)) !important;
1
2
d-divide-success-strong-inverted Deprecated
border-color: oklch(from var(--dt-color-border-success-strong-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-success-subtle Deprecated
border-color: oklch(from var(--dt-color-border-success-subtle) l c h / var(--dco, alpha)) !important;
1
2
d-divide-success-subtle-inverted Deprecated
border-color: oklch(from var(--dt-color-border-success-subtle-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-50 Deprecated
border-color: oklch(from var(--dt-color-tan-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-100 Deprecated
border-color: oklch(from var(--dt-color-tan-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-200 Deprecated
border-color: oklch(from var(--dt-color-tan-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-300 Deprecated
border-color: oklch(from var(--dt-color-tan-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-400 Deprecated
border-color: oklch(from var(--dt-color-tan-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-500 Deprecated
border-color: oklch(from var(--dt-color-tan-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-600 Deprecated
border-color: oklch(from var(--dt-color-tan-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-700 Deprecated
border-color: oklch(from var(--dt-color-tan-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-800 Deprecated
border-color: oklch(from var(--dt-color-tan-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-900 Deprecated
border-color: oklch(from var(--dt-color-tan-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-950 Deprecated
border-color: oklch(from var(--dt-color-tan-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-tan-1000 Deprecated
border-color: oklch(from var(--dt-color-tan-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-50 Deprecated
border-color: oklch(from var(--dt-color-teal-50) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-100 Deprecated
border-color: oklch(from var(--dt-color-teal-100) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-200 Deprecated
border-color: oklch(from var(--dt-color-teal-200) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-300 Deprecated
border-color: oklch(from var(--dt-color-teal-300) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-400 Deprecated
border-color: oklch(from var(--dt-color-teal-400) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-500 Deprecated
border-color: oklch(from var(--dt-color-teal-500) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-600 Deprecated
border-color: oklch(from var(--dt-color-teal-600) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-700 Deprecated
border-color: oklch(from var(--dt-color-teal-700) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-800 Deprecated
border-color: oklch(from var(--dt-color-teal-800) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-900 Deprecated
border-color: oklch(from var(--dt-color-teal-900) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-950 Deprecated
border-color: oklch(from var(--dt-color-teal-950) l c h / var(--dco, alpha)) !important;
1
2
d-divide-teal-1000 Deprecated
border-color: oklch(from var(--dt-color-teal-1000) l c h / var(--dco, alpha)) !important;
1
2
d-divide-warning
border-color: oklch(from var(--dt-color-border-warning) l c h / var(--dco, alpha)) !important;
1
2
d-divide-warning-inverted Deprecated
border-color: oklch(from var(--dt-color-border-warning-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-warning-strong
border-color: oklch(from var(--dt-color-border-warning-strong) l c h / var(--dco, alpha)) !important;
1
2
d-divide-warning-strong-inverted Deprecated
border-color: oklch(from var(--dt-color-border-warning-strong-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-warning-subtle
border-color: oklch(from var(--dt-color-border-warning-subtle) l c h / var(--dco, alpha)) !important;
1
2
d-divide-warning-subtle-inverted Deprecated
border-color: oklch(from var(--dt-color-border-warning-subtle-inverted) l c h / var(--dco, alpha)) !important;
1
2
d-divide-x
--divide-x-reverse: 0; -webkit-border-end: calc(1px * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; border-inline-end: calc(1px * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; -webkit-border-start: calc(1px * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important; border-inline-start: calc(1px * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important;
1
2
d-divide-x-reverse
--divide-x-reverse: 1;
1
2
d-divide-x0
--divide-x-reverse: 0; -webkit-border-end: calc(0 * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; border-inline-end: calc(0 * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; -webkit-border-start: calc(0 * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important; border-inline-start: calc(0 * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important;
1
2
d-divide-x2
--divide-x-reverse: 0; -webkit-border-end: calc(2px * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; border-inline-end: calc(2px * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; -webkit-border-start: calc(2px * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important; border-inline-start: calc(2px * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important;
1
2
d-divide-x4
--divide-x-reverse: 0; -webkit-border-end: calc(4px * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; border-inline-end: calc(4px * var(--divide-x-reverse)) solid var(--dt-color-border-default) !important; -webkit-border-start: calc(4px * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important; border-inline-start: calc(4px * (1 - var(--divide-x-reverse))) solid var(--dt-color-border-default) !important;
1
2
d-divide-y
--divide-y-reverse: 0; -webkit-border-before: calc(1px * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; border-block-start: calc(1px * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; -webkit-border-after: calc(1px * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important; border-block-end: calc(1px * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important;
1
2
d-divide-y-reverse
--divide-y-reverse: 1;
1
2
d-divide-y0
--divide-y-reverse: 0; -webkit-border-before: calc(0 * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; border-block-start: calc(0 * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; -webkit-border-after: calc(0 * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important; border-block-end: calc(0 * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important;
1
2
d-divide-y2
--divide-y-reverse: 0; -webkit-border-before: calc(2px * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; border-block-start: calc(2px * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; -webkit-border-after: calc(2px * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important; border-block-end: calc(2px * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important;
1
2
d-divide-y4
--divide-y-reverse: 0; -webkit-border-before: calc(4px * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; border-block-start: calc(4px * (1 - var(--divide-y-reverse))) solid var(--dt-color-border-default) !important; -webkit-border-after: calc(4px * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important; border-block-end: calc(4px * var(--divide-y-reverse)) solid var(--dt-color-border-default) !important;
1
2

Divide Color documentation last updated Thursday, June 18, 2026