# CSS: “border”: X is not a “color” value.

> Canonical HTML version: https://rocketvalidator.com/html-validation/css-border-x-is-not-a-color-value
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

A CSS `border` shorthand property has been assigned a value that the validator expects to be a `color`, but the value provided is not a recognized color.

This error typically appears when the `border` shorthand is missing a required component or has its values in an unexpected order. The `border` shorthand accepts up to three values: a width, a style, and a color. While the CSS specification allows these in any order, some validators and parsers can misinterpret values when the style keyword (such as `solid`, `dashed`, or `none`) is omitted.

A common cause is writing something like `border: 1px black` without a border style. The validator may try to interpret `black` or another value as filling the wrong role. Another cause is a typo in the color value itself, such as `grren` instead of `green`, or using a syntax the validator does not recognize.

Always include all three components in the `border` shorthand to avoid ambiguity: width, style, and color.

## HTML examples

### Invalid border value

```html
<p style="border: 1px black">Some text</p>
```

The missing style keyword (`solid`, `dashed`, etc.) can cause the validator to misinterpret which value maps to which component.

### Valid border value

```html
<p style="border: 1px solid black">Some text</p>
```

Including the width (`1px`), style (`solid`), and color (`black`) removes any ambiguity. If a border style is not specified, the initial value is `none`, which means no border is rendered, so omitting it is almost certainly a mistake anyway.