CSS Color Names vs. Everyday Color Names

Ask two people for sage green and you may get two different colors. Ask a browser for navy and you get #000080. CSS names are fixed values; everyday descriptions, palette titles and commercial color systems follow their own conventions.

A CSS keyword is a fixed value

The converter accepts standard CSS names without regard to letter case. Its parser recognizes more names than the 48 selected reference pages, so a valid input may not have a page of its own.

Different names, the same value

Cyan and aqua both mean #00FFFF in CSS; magenta and fuchsia both mean #FF00FF. Gray and grey are also interchangeable spellings. Use the name your project prefers while keeping the same hex value.

What a palette name tells you

Editorial Navy uses #10182B as its dark anchor; CSS navy is #000080. Sage Notebook contains #273A32, #F1F2E8, #71866F and #C8CFB7. Its title describes those four colors together, rather than defining a universal shade called sage.

Share names with exact values

• Write the hex value beside the display name.
• Name roles such as body text separately from their color values.
• Record which text color belongs on which background.
• Keep CSS keywords unchanged in code, even if you translate the display label.

:root {
  --color-1: #10182B;
  --color-2: #F7F3E8;
}
.article { color: var(--color-1); background: var(--color-2); }

When a name is not recognized

If an informal name is rejected, ask for the intended hex or RGB value from the design file or its owner. A nearby-looking search result may not be the right shade. Paint, fabric and brand specifications may also need information beyond a digital sRGB value.

When sharing a design in another language, translate the display label while retaining the CSS keyword and exact value in code. That keeps the color consistent even when its everyday name changes.