In this chapter we will learn how to use the border-bottom-color property.

CSS border-bottom-color property is used to set the color of an element's bottom border.

The border-bottom-color property we need to use with the border-style property.

CSS Syntax

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

Let's see an example:

<!DOCTYPE html>
    <title>Title of the document</title>
      div {
        border-style: dotted;
        border-color: #1c87c9;
        border-bottom-color: #8ebf42;
    <p>This is some example.</p>
    <div> Example for the border-bottom-color property..</div>

Property Values

Value Descriptions
color Indicates color of borders. Default color is black.
transparent Indicates that the border color to be transparent.
initial It makes the property use its default value.
inherit It inherits the property from its parents element.