Colors

Learn about the predefined colors and understand how to use them in D3.

We'll cover the following

What are the predefined named colors?

Throughout this course, I generally use colors defined by name. This is mainly because I can and not for any other reason. In fact, there are several different ways to define colors used in D3/JavaScript/CSS and HTML. I have no idea what the limitations for use are and/or how their use in different browsers impacts on correct representation. But I do know that they’re used widely.

The overriding point of all this is that there’s more than one way to define colors in your graphs.

It means that considering:

                .style("fill", "steelblue")

and…

                .style("fill", "#4682b4")
                .style("fill", "rgb(70,130,180)")

And, all three alternatives result in the same color being applied.

For a long time, I didn’t actually have the images of the colors represented here in “D3 Tips and Tricks.” But like all things, one day I thought, Hey, I could just write a simple script that placed them on the screen. So here they are.

Get hands-on with 1200+ tech skills courses.