border-color | CSS CSS Properties

A shorthand property that sets the color for all four borders of an element. If you provide four values, it sets them in 'top right bottom left' order.

Quick example

.multi-color-box {
  border-style: solid;
  border-width: 4px;
  /* top | right | bottom | left */
  border-color: red blue green yellow;
}

Quick facts

Initial value

See individual properties

Inherited

Applies to

all elements

border-color Browser Support

Widely available Since 2015 96% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.

Safe to use without fallbacks.

View on caniuse.com → View on MDN → View on webstatus.dev → Learn more about Baseline →

12+