</>
ValidateHTML

Invalid CSS Color Value

CSS colors can be specified as named colors (red, blue), hex codes (#ff0000), rgb(), hsl(), or modern formats like oklch(). Invalid color values include misspelled names, hex codes with wrong length, or malformed function syntax.

Why It Matters

An invalid color falls back to the inherited or initial color, which may be invisible (transparent or same as background). This can make text disappear or elements become invisible without any obvious error.

Code Examples

Bad CSS
p {
  color: redd;                /* misspelled name */
  background: #ff00;          /* 4 chars not valid shorthand */
  border-color: rgb(255, 0);  /* missing third value */
  outline: 1px solid grn;     /* misspelled */
}
Good CSS
p {
  color: red;
  background: #ff0000;        /* or #f00 shorthand */
  border-color: rgb(255, 0, 0);
  outline: 1px solid green;
}

How to Fix

  • 1Hex codes must be 3, 4, 6, or 8 characters (after #): #fff, #ffff, #ffffff, #ffffffff.
  • 2rgb() needs exactly 3 values (or 4 with alpha): rgb(255, 0, 0) or rgb(255 0 0 / 0.5).
  • 3Check spelling of named colors. Common mistakes: grey vs gray (both work), grn, rd, blu.
  • 4Use DevTools color picker to get correct values visually.

Check Your CSS Now

Our CSS validator detects this error automatically and shows the exact line number.

Open CSS Validator
Recommended

Hostinger — Fast & Affordable Web Hosting

Deploy clean, validated CSS on reliable hosting.

Get 80% Off Hosting →

Related CSS Errors

Invalid CSS Property Value

Learn why CSS property values are invalid and how to fix them. Common mistakes with colors, units, and keywords.

Missing Unit on CSS Value

Why CSS values need units and when they don't. Fix missing px, rem, em, and other unit errors.

Unknown CSS Property

How to fix unknown or misspelled CSS property names. Common typos and non-standard properties.

View all CSS errors