Named Color Vars
2,065 named color variables in JSON, SASS, and LESS color formats.
Project Overview
2,065 named color variables (no duplicate names, no duplicate colors). Provided in JSON, SCSS and LESS formats. Color names courtesy of Resene Paints and the XKCD Color Survey (minus potentially-offensive color names & negative connotations). Additional color names include those supported by all major browsers in the CSS3 spec.
Installation Options
package
Install via $ npm install named-color-vars --save;
Yarn package
Or install via $ yarn add named-color-vars;
unpkg.com CDN
Or install via <script src="https://unpkg.com/named-color-vars@1.0.17" integrity="sha384-wu1yiJkXAQGYeWol5rKJ8e2BvqOCw0Cu6YHSUj3ZkusP1UEX0nUjnkorEFO0Dbuc" crossorigin="anonymous"></script>
Modern Browsers
Works in AllIf you need to support IE <= 11 (prior to Edge), older versions of Android, and much older versions of other browsers, you can insert this polyfill before all other script tags. The polyfill.io service fills ES6 features that a user's browser is lacking, based on both UA & feature detection.
<!-- Before ALL other script tags in your document. -->
<!-- Only needed if you want to support much older browsers. -->
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6&flags=gated"></script>
Node.js Example
import {colors} from 'named-color-vars';
console.log(colors.springGreen); // #578363
Web Browser Example
<script src="https://unpkg.com/named-color-vars@1.0.17" integrity="sha384-wu1yiJkXAQGYeWol5rKJ8e2BvqOCw0Cu6YHSUj3ZkusP1UEX0nUjnkorEFO0Dbuc" crossorigin="anonymous"></script>
<script>
var colors = namedColorVars.colors;
console.log(colors.springGreen); // #578363
</script>
SCSS Example
You can download colors.scss
here:
https://unpkg.com/named-color-vars@1.0.17/src/colors.scss
@import 'colors.scss';
.my-style {
color: $spring-green-color;
}
LESS Example
You can download colors.less
here:
https://unpkg.com/named-color-vars@1.0.17/src/colors.less
@import 'colors.less';
.my-style {
color: @spring-green-color;
}
Commercial Use
This software is created, documented and maintained by Jason Caldwell (@jaswrks
) and a small team of talented developers at ‹src.works/›. It's open source, but if you use it commercially, please pay what you can.
Development Channels
Always use the latest stable version in production. If you want upcoming changes ahead of time use the @dev
or @rc
tag, but please do so at your own risk. The @dev
and @rc
tags are potentially unstable at various times throughout a development cycle, and therefore should not be used in production.
Channel | NPM Tag | Description | SemVer | GitHub |
---|---|---|---|---|
Hackers | @dev |
Latest Bleeding Edge potentially-unstable |
master (PRs) | |
Lab Rats | @rc |
Next Release Candidate upcoming semi-stable release |
releases | |
Everyone | @latest |
Latest Stable Version highly recommended |
releases |
NPM Consumption Examples
Channel | NPM Tag | NPM package.json |
---|---|---|
Hackers | @dev | "named-color-vars": "dev" |
Lab Rats | @rc | "named-color-vars": "rc" |
Everyone | @latest | "named-color-vars": "latest" |
Latest Stable Version | "named-color-vars": "^1.0.17" |
Channel | NPM Tag | NPM Install |
---|---|---|
Hackers | @dev | npm install named-color-vars@dev |
Lab Rats | @rc | npm install named-color-vars@rc |
Everyone | @latest | npm install named-color-vars@latest |
Latest Stable Version | npm install named-color-vars |
CDN Directory Indexes
Channel | NPM Tag | CDN Distribution Index |
---|---|---|
Hackers | @dev | https://unpkg.com/named-color-vars@dev/dist/ |
Lab Rats | @rc | https://unpkg.com/named-color-vars@rc/dist/ |
Everyone | @latest | https://unpkg.com/named-color-vars@latest/dist/ |
Latest Stable Version | https://unpkg.com/named-color-vars@1.0.17/dist/ |
CDN Script URLs
Channel | NPM Tag | CDN Script URL |
---|---|---|
Hackers | @dev | https://unpkg.com/named-color-vars@dev |
Lab Rats | @rc | https://unpkg.com/named-color-vars@rc |
Everyone | @latest | https://unpkg.com/named-color-vars@latest |
Latest Stable Version | https://unpkg.com/named-color-vars@1.0.17 |
In production, use the latest stable version with an SRI integrity hash.
<script src="https://unpkg.com/named-color-vars@1.0.17" integrity="sha384-wu1yiJkXAQGYeWol5rKJ8e2BvqOCw0Cu6YHSUj3ZkusP1UEX0nUjnkorEFO0Dbuc" crossorigin="anonymous"></script>
Tip: Don't use an SRI hash with a tag like @dev
, @rc
, or @latest
. Tags reference a version dynamically; e.g., the @latest
tag will point to an updated copy once the next version is released. So a tagged release URL may render an SRI invalid. If you need the SRI, use a specific @x.x.x
version in the URL instead of a tag.
MIT License
For full details see: LICENSE.txt
Changelog
For full details see: CHANGELOG.md
Semantic Versioning
New versions are released following semver.org guidelines.
Pull Requests Welcome
the
master
branch at GitHub and submit your changes for review.