Skip to main content

Border Color

Borders

Utilities for controlling the color of an element's borders.

ClassPropertiesValue
ob-border-inheritborder-color: inherit
ob-border-currentborder-color: currentColor
ob-border-transparentborder-color: transparent
ob-border-whiteborder-color: var(--ob-white)
ob-border-blackborder-color: var(--ob-black)
ob-border-body-lightborder-color: var(--ob-body-light)
ob-border-body-darkborder-color: var(--ob-body-dark)
ob-border-white-emph-highborder-color: var(--ob-white-emph-high)
ob-border-white-emph-mediumborder-color: var(--ob-white-emph-medium)
ob-border-white-emph-lowborder-color: var(--ob-white-emph-low)
ob-border-black-emph-highborder-color: var(--ob-black-emph-high)
ob-border-black-emph-mediumborder-color: var(--ob-black-emph-medium)
ob-border-black-emph-lowborder-color: var(--ob-black-emph-low)
ob-border-primary-50border-color: var(--ob-primary-50)
ob-border-primary-100border-color: var(--ob-primary-100)
ob-border-primary-200border-color: var(--ob-primary-200)
ob-border-primary-300border-color: var(--ob-primary-300)
ob-border-primary-400border-color: var(--ob-primary-400)
ob-border-primary-500border-color: var(--ob-primary-500)
ob-border-primary-600border-color: var(--ob-primary-600)
ob-border-primary-700border-color: var(--ob-primary-700)
ob-border-primary-800border-color: var(--ob-primary-800)
ob-border-primary-900border-color: var(--ob-primary-900)
ob-border-secondary-50border-color: var(--ob-secondary-50)
ob-border-secondary-100border-color: var(--ob-secondary-100)
ob-border-secondary-200border-color: var(--ob-secondary-200)
ob-border-secondary-300border-color: var(--ob-secondary-300)
ob-border-secondary-400border-color: var(--ob-secondary-400)
ob-border-secondary-500border-color: var(--ob-secondary-500)
ob-border-secondary-600border-color: var(--ob-secondary-600)
ob-border-secondary-700border-color: var(--ob-secondary-700)
ob-border-secondary-800border-color: var(--ob-secondary-800)
ob-border-secondary-900border-color: var(--ob-secondary-900)
ob-border-tertiary-50border-color: var(--ob-tertiary-50)
ob-border-tertiary-100border-color: var(--ob-tertiary-100)
ob-border-tertiary-200border-color: var(--ob-tertiary-200)
ob-border-tertiary-300border-color: var(--ob-tertiary-300)
ob-border-tertiary-400border-color: var(--ob-tertiary-400)
ob-border-tertiary-500border-color: var(--ob-tertiary-500)
ob-border-tertiary-600border-color: var(--ob-tertiary-600)
ob-border-tertiary-700border-color: var(--ob-tertiary-700)
ob-border-tertiary-800border-color: var(--ob-tertiary-800)
ob-border-tertiary-900border-color: var(--ob-tertiary-900)
ob-border-neutral-50border-color: var(--ob-neutral-50)
ob-border-neutral-100border-color: var(--ob-neutral-100)
ob-border-neutral-200border-color: var(--ob-neutral-200)
ob-border-neutral-300border-color: var(--ob-neutral-300)
ob-border-neutral-400border-color: var(--ob-neutral-400)
ob-border-neutral-500border-color: var(--ob-neutral-500)
ob-border-neutral-600border-color: var(--ob-neutral-600)
ob-border-neutral-700border-color: var(--ob-neutral-700)
ob-border-neutral-800border-color: var(--ob-neutral-800)
ob-border-neutral-900border-color: var(--ob-neutral-900)
ob-border-accent-50border-color: var(--ob-accent-50)
ob-border-accent-100border-color: var(--ob-accent-100)
ob-border-accent-200border-color: var(--ob-accent-200)
ob-border-accent-300border-color: var(--ob-accent-300)
ob-border-accent-400border-color: var(--ob-accent-400)
ob-border-accent-500border-color: var(--ob-accent-500)
ob-border-accent-600border-color: var(--ob-accent-600)
ob-border-accent-700border-color: var(--ob-accent-700)
ob-border-accent-800border-color: var(--ob-accent-800)
ob-border-accent-900border-color: var(--ob-accent-900)
ob-border-informative-50border-color: var(--ob-informative-50)
ob-border-informative-100border-color: var(--ob-informative-100)
ob-border-informative-200border-color: var(--ob-informative-200)
ob-border-informative-300border-color: var(--ob-informative-300)
ob-border-informative-400border-color: var(--ob-informative-400)
ob-border-informative-500border-color: var(--ob-informative-500)
ob-border-informative-600border-color: var(--ob-informative-600)
ob-border-informative-700border-color: var(--ob-informative-700)
ob-border-informative-800border-color: var(--ob-informative-800)
ob-border-informative-900border-color: var(--ob-informative-900)
ob-border-success-50border-color: var(--ob-success-50)
ob-border-success-100border-color: var(--ob-success-100)
ob-border-success-200border-color: var(--ob-success-200)
ob-border-success-300border-color: var(--ob-success-300)
ob-border-success-400border-color: var(--ob-success-400)
ob-border-success-500border-color: var(--ob-success-500)
ob-border-success-600border-color: var(--ob-success-600)
ob-border-success-700border-color: var(--ob-success-700)
ob-border-success-800border-color: var(--ob-success-800)
ob-border-success-900border-color: var(--ob-success-900)
ob-border-warning-50border-color: var(--ob-warning-50)
ob-border-warning-100border-color: var(--ob-warning-100)
ob-border-warning-200border-color: var(--ob-warning-200)
ob-border-warning-300border-color: var(--ob-warning-300)
ob-border-warning-400border-color: var(--ob-warning-400)
ob-border-warning-500border-color: var(--ob-warning-500)
ob-border-warning-600border-color: var(--ob-warning-600)
ob-border-warning-700border-color: var(--ob-warning-700)
ob-border-warning-800border-color: var(--ob-warning-800)
ob-border-warning-900border-color: var(--ob-warning-900)
ob-border-error-50border-color: var(--ob-error-50)
ob-border-error-100border-color: var(--ob-error-100)
ob-border-error-200border-color: var(--ob-error-200)
ob-border-error-300border-color: var(--ob-error-300)
ob-border-error-400border-color: var(--ob-error-400)
ob-border-error-500border-color: var(--ob-error-500)
ob-border-error-600border-color: var(--ob-error-600)
ob-border-error-700border-color: var(--ob-error-700)
ob-border-error-800border-color: var(--ob-error-800)
ob-border-error-900border-color: var(--ob-error-900)
ob-border-white-trans-90border-color: var(--ob-white-trans-90)
ob-border-white-trans-80border-color: var(--ob-white-trans-80)
ob-border-white-trans-70border-color: var(--ob-white-trans-70)
ob-border-white-trans-60border-color: var(--ob-white-trans-60)
ob-border-white-trans-50border-color: var(--ob-white-trans-50)
ob-border-white-trans-40border-color: var(--ob-white-trans-40)
ob-border-white-trans-20border-color: var(--ob-white-trans-20)
ob-border-white-trans-10border-color: var(--ob-white-trans-10)
ob-border-white-trans-5border-color: var(--ob-white-trans-5)
ob-border-white-trans-1border-color: var(--ob-white-trans-1)