column-rule-color

The column-rule-color CSS property defines the colors of the lines drawn between columns in multi-column grid, flex, and multi-col layouts.

The column-rule-color property defines the colors of any lines drawn in the gaps between columns in multi-column, flex, and grid containers with more than one column.

The value is a comma-separated list of components, which can include <line-color>, <repeat-line-color>, and <auto-repeat-line-color> types.

The column-rule-color, along with the column-rule-width and column-rule-style properties, can be set using the column-rule shorthand. The column-rule-color, along with the row-rule-color property, can also be set using the rule-color shorthand.

A <line-color> can be declared as any valid CSS <color> value. If the property value consists of only one <color>, all the rule lines will be that color. For example, if we declare the following, the lines in the gutters between columns will all be blue:

Syntax example: column-rule-color: purple;