border-bottom-color

Definition

border-bottom-color is a CSS property that sets the color of the bottom border of an element. It is used in conjunction with border-bottom-style and border-bottom-width to define the bottom border of an element.

Examples

Hex code

.element {
  border-bottom-color: #ff0000;
}

Keyword

.element {
  border-bottom-color: red;
}

Color function

.element {
  border-bottom-color: rgb(255, 0, 0);
}

Global values

.element {
  border-bottom-color: inherit;
  border-bottom-color: initial;
  border-bottom-color: unset;
}

Values

Best Practices

• Use a clear and readable color for the border to improve the accessibility and usability of your site.
• Avoid using too many different border colors on a single page as it can be visually overwhelming.
• Make sure the border color matches the overall design and color scheme of your site.
• Use the border-bottom-color property in conjunction with the border-bottom-style and border-bottom-width properties to fully define the bottom border of an element.

Browser Compatibility