v149 · CSS · Border Color Demo
Border Color Demo
A table with border: 1px solid but no explicit border-color. In Chrome 149+, the border colour inherits from the element's color property as the spec requires. Change the text color with the buttons to see the borders follow.
CSS inheritance rule: When
border-color is not set, it inherits from color via the currentColor keyword. Chrome 149 removes the UA border-color: gray rule that was overriding this.
live demo
Table — border: 1px solid (no explicit border-color)
| Name | Type | Value |
|---|---|---|
| border-color | inherited | currentColor |
| color | author | var(--text-charcoal) |
| UA rule | removed | Chrome 149+ |
computed border-color: reading…
before vs after Chrome 149
Before Chrome 149
Table with color: blue — borders stay gray (UA rule wins)
| Col A | Col B |
|---|---|
| text is blue | borders are gray |
| inconsistent | with spec |
Chrome 149+
Table with color: blue — borders are blue (inherits correctly)
| Col A | Col B |
|---|---|
| text is blue | borders are blue ✓ |
| consistent | with spec |
see also
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗