CSS border-block-end-color

The border-block-end-color property in CSS is used to set the color of the block-ending border of a block-level element. This property is part of the CSS Logical Properties module, which allows you to specify properties in a way that is independent of the writing mode.

The border-block-end-color property can be used on elements that have block-end borders, such as <div> or <p> elements. It takes a color value as its property, such as a color keyword, a hexadecimal color value, or an RGB value.

Let's take a look at an example to see how the border-block-end-color property works:


    .box {
      border-block-end-color: blue;
      border-block-end-width: 2px;
      border-block-style: solid;
    }

Result:

This is a sample text with a blue block-end border.

In this example, we have applied the border-block-end-color property to a .box class with a value of blue. We have also set the border-block-end-width to 2px and the border-block-style to solid. This creates a block-end border at the end of the element with a blue color.

You can customize the border-block-end-color property with different color values to achieve the desired styling for your elements.