npmWeb Frontendupdated 08 Aug 2026

css-color-names

Item: css-color-names
Rating: 2.8
Author: Keyoor

css-color-names is a dependency-free JSON object mapping 148 lowercase CSS named colors to lowercase six-digit hex strings. Requiring the package loads the JSON directly, so cssColors.tomato returns #ff6347 and aliases such as aqua and cyan share a value. There is no parser, conversion code, validation API, alpha channel, TypeScript declaration, or standards update mechanism at runtime. The repository's build script generated the file by scraping a W3Schools page, and the published data has not changed since version 1.0.1 in 2019.

css-color-names · v1.0.1 · 2.9M/wk · ★ 149 · pushed 19 Feb 2019 · bahamas10/css-color-names · docs · reviewed by Keyoor

Verdict

A serviceable frozen lookup table when all you need is name to hex. Do not install it as a CSS color validator or parser; use a maintained parser for any user-facing color input.

API stability5/5The complete public contract is a JSON object whose lowercase keys map to six-digit hex strings, and version 1.0.1 has remained unchanged since February 2019. There are no functions, options, dependencies, generated classes, or runtime branches to drift. That makes pinned behavior exceptionally predictable, although no stated compatibility policy promises how a future regenerated table would treat additions.

Docs2/5The README accurately shows installation, one CommonJS require, the object shape, the MIT license, and a brief account of the scraping pipeline. It does not enumerate the 148 supported keys, explain lowercase normalization, disclose that transparent and broader CSS syntaxes are absent, discuss duplicate-value aliases, warn about own-property validation, or cover ESM, TypeScript, browser bundlers, and provenance limitations.

Maintenance1/5npm records the latest release, 1.0.1, on February 19, 2019, and GitHub reports the last push on the same date. The repository is not archived and currently has zero open issues and PRs, but there have been no data refreshes, automation updates, provenance improvements, type declarations, or releases for more than seven years. A static table needs little work, yet it also receives no visible verification.

Ecosystem3/5The npm endpoint counted 2,870,270 downloads for July 31 through August 6, 2026, and the repository has 149 stars, indicating wide transitive use for a single JSON asset. There are no plugins, framework adapters, types, or extension interfaces, and modern color tooling offers parsing and conversion beyond this table. Its ecosystem value is compatibility and ubiquity, not an active community surface.

Use it if

You need a small static lookup from familiar CSS color names to six-digit hex strings
You are maintaining CommonJS code that already expects a plain object rather than a parser or color class
You want to enumerate named colors for a picker, autocomplete list, fixture, or documentation generator

Skip it if

You need to validate general CSS colors: the object does not recognize hex input, rgb(), hsl(), lab(), color(), currentColor, CSS variables, or transparent
You need alpha information or color conversion and manipulation: every stored value is exactly six hex digits and the package exports no functions
You require a standards-grounded update process: the repository says its generator scrapes W3Schools, not a CSS specification or Web Platform Test dataset
You expect direct user-input lookup to prove membership: the exported JSON object inherits Object.prototype, so names such as constructor need an own-property check rather than a truthiness test
You need active maintenance or bundled types: version 1.0.1 and the repository's last push are both from February 2019, and the package contains only the JSON data file

Setup reality

npm install css-color-names adds no dependencies, peer dependencies, native builds, credentials, or configuration. In CommonJS, require('css-color-names') works because package.json points main directly at css-color-names.json. Modern Node ESM requires a JSON import attribute, while bundlers differ in whether they accept a package whose entry point is JSON; test your build target instead of assuming named exports. The package has no TypeScript declarations, so strict projects may need a local module declaration or an explicit cast. All 148 keys are lowercase even though CSS named colors are ASCII case-insensitive, so normalize user input with trim().toLowerCase(). Do not validate with Boolean(colors[name]): ordinary JSON parsing creates an object with Object.prototype, and inherited keys such as constructor are not color entries. Use Object.hasOwn. Values are lowercase #rrggbb strings, but nine groups share the same value, including gray/grey and aqua/cyan, so reverse lookup is one-to-many and there is no canonical alias. transparent is absent because it cannot be represented as an opaque six-digit hex value. The data file is loaded as a whole and offers no tree-shakable per-color exports. Its build script scraped a third-party HTML page, and no published refresh has occurred since 2019, so pin the version if exact enumeration matters and add tests for names your product promises.

Patterns

Look up a known colorlook-up-color

const colors = require('css-color-names');

console.log(colors.tomato); // #ff6347

The package exports the JSON object itself. Values are lowercase six-digit hex strings.

Normalize a case-insensitive CSS namenormalize-user-name

const colors = require('css-color-names');

const input = '  RebeccaPurple ';
const key = input.trim().toLowerCase();
const hex = Object.hasOwn(colors, key) ? colors[key] : null;

CSS color names are case-insensitive, but all object keys are lowercase and whitespace is not accepted automatically.

Validate membership safelyvalidate-color-name

const colors = require('css-color-names');

function isNamedColor(value) {
  return typeof value === 'string' &&
    Object.hasOwn(colors, value.toLowerCase());
}

console.log(isNamedColor('constructor')); // false

Do not use Boolean(colors[value]). The object inherits properties such as constructor that are not CSS color names.

Resolve a name with a fallbackresolve-with-fallback

const colors = require('css-color-names');

function resolveNamedColor(name, fallback = '#000000') {
  const key = String(name).trim().toLowerCase();
  return Object.hasOwn(colors, key) ? colors[key] : fallback;
}

This only resolves names in the table. Passing #fff, rgb(), transparent, or a CSS variable uses the fallback.

List every available namelist-color-names

const colors = require('css-color-names');

const names = Object.keys(colors).sort();
console.log(names.length); // 148

Aliases are separate names, so the number of names is larger than the number of unique hex values.

Find every name for a hex valuefind-color-aliases

const colors = require('css-color-names');

function aliasesFor(hex) {
  const target = hex.toLowerCase();
  return Object.entries(colors)
    .filter(([, value]) => value === target)
    .map(([name]) => name);
}

console.log(aliasesFor('#00ffff')); // ['aqua', 'cyan']

Reverse lookup is one-to-many. The package does not designate aqua over cyan, gray over grey, or any other canonical spelling.

Convert a stored value to RGB channelsconvert-hex-to-rgb

const colors = require('css-color-names');

function namedRgb(name) {
  const hex = colors[name.toLowerCase()];
  if (!hex) return null;
  return {
    r: parseInt(hex.slice(1, 3), 16),
    g: parseInt(hex.slice(3, 5), 16),
    b: parseInt(hex.slice(5, 7), 16),
  };
}

This works because every package value has the #rrggbb form. It does not parse arbitrary CSS color strings.

Build options for a color pickerbuild-color-select

const colors = require('css-color-names');

const options = Object.entries(colors).map(([name, hex]) => ({
  value: name,
  label: name.replace(/(^|.)([a-z])/g, (_, p, c) => p + c.toUpperCase()),
  swatch: hex,
}));

Names are stored without word boundaries, so display-name formatting is heuristic for entries such as lightgoldenrodyellow.

Filter names for autocompletesearch-color-names

const colors = require('css-color-names');

function searchColors(query) {
  const needle = query.trim().toLowerCase();
  return Object.keys(colors).filter((name) => name.includes(needle));
}

console.log(searchColors('slate'));

This is substring matching only. The package provides no fuzzy search, human labels, localization, or popularity ranking.

Generate CSS custom propertiescreate-css-variables

const colors = require('css-color-names');

const css = ':root {\n' +
  Object.entries(colors)
    .map(([name, hex]) => `  --named-${name}: ${hex};`)
    .join('\n') +
  '\n}';

Generating all entries creates aliases with identical values. Select a subset if output size or design-token clarity matters.

Import the JSON entry in Node ESMimport-from-esm

import colors from 'css-color-names' with { type: 'json' };

console.log(colors.cornflowerblue);

The package entry is JSON, not JavaScript or native ESM. JSON import-attribute support depends on the Node version and toolchain.

Describe the package in TypeScriptadd-typescript-shape

declare module 'css-color-names' {
  const colors: Record<string, `#${string}`>;
  export = colors;
}

Version 1.0.1 ships no declaration file. This type captures the general shape but cannot make arbitrary string lookups safe or enumerate the 148 literal keys.

Alternatives

Package	Registry	Pick it when
color-name	npm	You want a maintained named-color table whose values are RGB channel arrays
colord	npm	You need small, typed parsing, validation, conversion, alpha handling, and optional plugins
color	npm	You want a richer object API for parsing, converting, mixing, lightening, and serializing colors
parse-color	npm	You need an older CommonJS parser that accepts several color syntaxes rather than only names