A Dive Into Web Safe Colors, And Why You Shouldn't Use Them

Ah, the 90s internet! The era when the internet was a wild frontier, and screens could only muster a miniscule amount of colors. Let's dive into the colorful history and nostalgia of web-safe colors, and why you shouldn't think about them anymore.

The History of Web Safe Colors

In the mid-1990s, computer displays could only display a teeny tiny amount of colors compared to today's technology. 256 to be exact. Because of the difference in displays and color limit, if a color was used that wasn't supported, the display showed a different color. This meant that websites might look completely different depending on who looked at them. Because of this, a set of 216 colors was created that could be displayed constantly across devices without issues. This became known as the "Web Safe" color palette (See below.)

But why 216 and not 256? Well, Operating Systems were a little greedy, reserving a portion of the colors for their own use. So, designers were left with 216 colors, which they were encouraged to stick to on their websites.

Are "Web Safe" colors really safe?

As we sailed into the 2000s, 256-color displays were tossed overboard, replaced by the superior 24-bit (TrueColor) displays that could display 16,777,216 color variations.

But even in their heyday, web safe colors weren't perfect. On certain systems, web safe colors would still look different, and it was discovered that only 22 of the 216 colors were reliably displayed! If you really wanted things to be safe, you'd have to stick to those 22 colors. But that's not many options to choose from, is it?

The New Era of Color Technology

Fast forward to today, and we're living in a world of millions of colors in sRGB and beyond. Many modern devices support technologies like display p-3 that contain 25% more colors than sRGB. So, don't limit yourself to web safe colors, especially when there are practically no users left on 256 color displays. Even better, embrace new the era of color technology, and use display p-3, oklch, and more!

For example, you can use css to specify a super bright green color in oklch:

.super-bright-green {
    /* Fallback to sRGB hex code */
    background: #00f659;
    /* OKlch color */
    background: oklch(84.85% 0.353 146.65);
}

Note: If the colors look the same, most likely your browser or display doesn't support oklch yet.

What it looks like:

OKLCH

sRGB

Complete List of Web Safe Colors

Below is a color chart of web safe colors in all their glory! Click on any web safe color color to copy the hex code to your clipboard.

#000000

#000033

#000066

#000099

#0000CC

#0000FF

#003300

#003333

#003366

#003399

#0033CC

#0033FF

#006600

#006633

#006666

#006699

#0066CC

#0066FF

#009900

#009933

#009966

#009999

#0099CC

#0099FF

#00CC00

#00CC33

#00CC66

#00CC99

#00CCCC

#00CCFF

#00FF00

#00FF33

#00FF66

#00FF99

#00FFCC

#00FFFF

#330000

#330033

#330066

#330099

#3300CC

#3300FF

#333300

#333333

#333366

#333399

#3333CC

#3333FF

#336600

#336633

#336666

#336699

#3366CC

#3366FF

#339900

#339933

#339966

#339999

#3399CC

#3399FF

#33CC00

#33CC33

#33CC66

#33CC99

#33CCCC

#33CCFF

#33FF00

#33FF33

#33FF66

#33FF99

#33FFCC

#33FFFF

#660000

#660033

#660066

#660099

#6600CC

#6600FF

#663300

#663333

#663366

#663399

#6633CC

#6633FF

#666600

#666633

#666666

#666699

#6666CC

#6666FF

#669900

#669933

#669966

#669999

#6699CC

#6699FF

#66CC00

#66CC33

#66CC66

#66CC99

#66CCCC

#66CCFF

#66FF00

#66FF33

#66FF66

#66FF99

#66FFCC

#66FFFF

#990000

#990033

#990066

#990099

#9900CC

#9900FF

#993300

#993333

#993366

#993399

#9933CC

#9933FF

#996600

#996633

#996666

#996699

#9966CC

#9966FF

#999900

#999933

#999966

#999999

#9999CC

#9999FF

#99CC00

#99CC33

#99CC66

#99CC99

#99CCCC

#99CCFF

#99FF00

#99FF33

#99FF66

#99FF99

#99FFCC

#99FFFF

#CC0000

#CC0033

#CC0066

#CC0099

#CC00CC

#CC00FF

#CC3300

#CC3333

#CC3366

#CC3399

#CC33CC

#CC33FF

#CC6600

#CC6633

#CC6666

#CC6699

#CC66CC

#CC66FF

#CC9900

#CC9933

#CC9966

#CC9999

#CC99CC

#CC99FF

#CCCC00

#CCCC33

#CCCC66

#CCCC99

#CCCCCC

#CCCCFF

#CCFF00

#CCFF33

#CCFF66

#CCFF99

#CCFFCC

#CCFFFF

#FF0000

#FF0033

#FF0066

#FF0099

#FF00CC

#FF00FF

#FF3300

#FF3333

#FF3366

#FF3399

#FF33CC

#FF33FF

#FF6600

#FF6633

#FF6666

#FF6699

#FF66CC

#FF66FF

#FF9900

#FF9933

#FF9966

#FF9999

#FF99CC

#FF99FF

#FFCC00

#FFCC33

#FFCC66

#FFCC99

#FFCCCC

#FFCCFF

#FFFF00

#FFFF33

#FFFF66

#FFFF99

#FFFFCC

#FFFFFF

FAQs

Are web safe colors still relevant?

No, web safe colors are very outdated. They were created when 90s-era computers could only display 256 colors, however now that most devices support millions of colors, there's no reason to use them.

What are web safe colors?

"Web Safe Colors" are an outdated set of 216 colors that were the recognized standard for web design in the 90s. They were created to ensure that websites looked the same across different devices.

How can you tell if a color is web safe?

Web safe colors are divided into multiples of hexadecimal 33. So if you split up the R, G, and B values of a color, they should all be one of these values:

00  33  66  99  CC FF

Are HTML color names web safe?

Only a small number named html colors are "web safe", and since web safe colors are obsolete there's no reason to use them. For posterity though, here's a list of html colors that are web safe:

red
blue
green
lime
olive
yellow
maroon
navy
purple
teal
fuchsia
aqua
black
silver
gray
white

Conclusion

It's time to say goodbye to web safe colors. It's been a colorful journey, but like dial-up internet and floppy disks, it's time to leave them in the 90s where they belong.