How to use clrs.cc for cool CSS color blending

How to use clrs.cc to cool CSS color, I believe that many inexperienced people are helpless about this, this article summarizes the causes of the problem and solutions, through this article I hope you can solve this problem.

clrs.cc is an interesting project recently discovered on GitHub. It is a well-designed web color scheme.

The default colors for the web look... more... er... how to put it... classic...

Navy #000080

Blue #0000ff

Aqua #00ffff

Teal #008080

Olive #008000

Green #008000

Lime #00ff00

Yellow #ffff00

Orange #ffa500

Red #ff0000

Maroon #800000

Fuchsia #ff00ff

Purple #800080

Silver #c0c0c0

Gray #808080

Black #000000

So clrs.cc redid it.

CSS Code Copy content to clipboard

colors = {

# Cool Colors

aqua: "#7FDBFF",

blue: "#0074D9",

lime: "#01FF70",

navy: "#001F3F",

teal: "#39CCCC",

olive: "#3D9970",

green: "#2ECC40",

# Warm Colors

red: "#FF4136",

maroon: "#85144B",

orange: "#FF851B",

purple: "#B10DC9",

yellow: "#FFDC00",

fuchsia: "#F012BE",

# Gray Scale Colors

gray: "#aaa",

white: "#fff",

black: "#111",

silver: "#ddd"

};

Css files are provided and can be accessed via github:

The code is as follows:

git clone git@github.com:mrmrs/colors.git

For example, CSS is used as follows:

CSS Code Copy content to clipboard

If you want to use the compressed version, use the min version:

CSS Code Copy content to clipboard

If you want to adjust the color, you can modify the css file directly. If compression is required, there are gulp missions that provide:

The code is as follows:

gulp minfy

You may be accustomed to sass, style, myth, then you can directly modify the corresponding file in git repo, and then use gulp to generate css:

The code is as follows:

glup sass

The code is as follows:

glup stylus

The code is as follows:

gulp myth

project home page

After reading the above, do you know how to use clrs.cc to make cool CSS colors? If you still want to learn more skills or want to know more related content, welcome to pay attention to the industry information channel, thank you for reading!