CSS border-right-color Property Tutorial

In this section, we will learn what the border-right-color property is and how to use it in CSS.

Click here to run the example of border-right-color property.

CSS border-right-color Property Definition and Usage

The border-right-color property is used to set a color value for the right border of an element.

Note: before using this property, the border should already exist. We can create a border via the border-style, border-bottom-style, or border property.

CSS border-right-color Property Syntax

border-right-color: color|transparent|initial|inherit;

CSS border-right-color Property Value

We can use RGB, RGBA, HSL, HSLA, color-name as the value of this property.

Also, we can use the value “transparent” to set a transparent color for the target bottom border.

Example: border-right-color property in CSS

See the Pen border-right-color property in CSS by Enjoy Tutorials (@enjoytutorials) on CodePen.

How Does CSS border-right-color Property Work?

Here, we’ve used the border-right-color property to change the color of the right border from black to red. (Note that the default color of a border is the same as the color of its font.)

Leave a Reply