{"id":1323,"date":"2010-03-29T00:01:16","date_gmt":"2010-03-29T08:01:16","guid":{"rendered":"http:\/\/www.wambooli.com\/blog\/?p=1323"},"modified":"2010-03-27T13:16:03","modified_gmt":"2010-03-27T21:16:03","slug":"rgby-oh-my-part-i","status":"publish","type":"post","link":"https:\/\/www.wambooli.com\/blog\/?p=1323","title":{"rendered":"RGBY – Oh, My! Part I"},"content":{"rendered":"

\"\"
\nIt feels like a Twilight Zone<\/em> opening: There is a fourth color, beyond that known to computers. That color, is yellow.
\n
\nBefore going into RGBY, let me take on a familiarity tour of RGB.<\/p>\n

RGB stands for red, green, and blue, the three primary colors.<\/p>\n

Yes, in Kindergarden finger painting class, you probably were taught that red, blue, and yellow were the primary colors. Yes, they’re primary subtractive<\/em> colors, which apply to pigments, paints, and dyes. When you’re mixing light to produce an image, you use additive<\/em> colors: red, green, and blue.<\/p>\n

By combining the colors red, green, and blue you can get just about any other color your human eyeball can see, such as these six, basic colors shown in this simple color wheel:<\/p>\n

\"\"<\/p>\n

You can also add two colors to that wheel: black and white. Here’s how the colors are combined and created:<\/p>\n\n\n\n\n\n\n\n\n\n\n
 <\/th>\nRed<\/th>\nGreen<\/th>\nBlue<\/th>\n<\/tr>\n
Red<\/th>\n100%<\/td>\n0%<\/td>\n0%<\/td>\n<\/tr>\n
Yellow<\/th>\n100%<\/td>\n100%<\/td>\n0%<\/td>\n<\/tr>\n
Green<\/th>\n0%<\/td>\n100%<\/td>\n0%<\/td>\n<\/tr>\n
Cyan<\/th>\n100%<\/td>\n100%<\/td>\n100%<\/td>\n<\/tr>\n
Blue<\/th>\n0%<\/td>\n0%<\/td>\n100%<\/td>\n<\/tr>\n
Magenta<\/th>\n100%<\/td>\n0%<\/td>\n100%<\/td>\n<\/tr>\n
Black<\/th>\n0%<\/td>\n0%<\/td>\n0%<\/td>\n<\/tr>\n
White<\/th>\n100%<\/td>\n100%<\/td>\n100%<\/td>\n<\/tr>\n<\/table>\n

Computers have long-used red, green, and blue to produce color images on a monitor. In fact, I remember the proper order because of the old RGB monitors, where the RGB stood for red, green, and blue.<\/p>\n

It’s important to get the order right because color programming and design often involves setting the values for red, green, and blue in that order.<\/p>\n

For example, when defining color for a web page, HTML uses RGB values. Rather than use percentage values, as I did in the table above, HTML uses 256 values: There are 256 values for red, 256 values for green, and 256 values for blue. Those combinations make for millions of possible colors on a web page.<\/p>\n

Of course, HTML uses hexadecimal values to keep things neat. So when setting the color yellow, for example, you use the value #FFFF00<\/code>.<\/p>\n

While #FFFF00<\/code> may look scary, remember RGB: That’s FF<\/code> for red, or 100%, then FF <\/code>for green (100%), and 00<\/code> or 0% for blue. The end result, from the table and the color wheel above, is yellow. #FFFF00<\/code> is the HTML color code for yellow.<\/p>\n

Gander at this updated color table:<\/p>\n\n\n\n\n\n\n\n\n\n\n
 <\/th>\nHTML<\/th>\n<\/tr>\n
Red<\/th>\n#FF0000<\/code><\/td>\n<\/tr>\n
Yellow<\/th>\n#FFFF00<\/code><\/td>\n<\/tr>\n
Green<\/th>\n#00FF00<\/code><\/td>\n<\/tr>\n
Cyan<\/th>\n#00FFFF<\/code><\/td>\n<\/tr>\n
Blue<\/th>\n#0000FF<\/code><\/td>\n<\/tr>\n
Magenta<\/th>\n#FF00FF<\/code><\/td>\n<\/tr>\n
Black<\/th>\n#000000<\/code><\/td>\n<\/tr>\n
White<\/th>\n#FFFFFF<\/code><\/td>\n<\/tr>\n<\/table>\n

That’s still the same ol’ RGB. In fact, that’s how I read the code left-to-right: are jee bee.<\/p>\n

HTML uses other values besides FF<\/code> and 00<\/code>. The “half” value of FF<\/code> is 80<\/code> in hexadecimal. Then there are all sorts of other in between values. (Hexadecimal uses numbers 0<\/code> through 9<\/code> and letters A<\/code> through F<\/code> to represent values 0 through 15. Read more about hexadecimal here<\/a>).<\/p>\n

All told, there are over 16 million possible color combinations in HTML. You can see a bunch of them at this web site<\/a>.<\/p>\n

Incidentally, DOS used a similar scheme with the same colors, though DOS kind of messed up the order:<\/p>\n

\"\"<\/p>\n

Once upon a time, I had that sequence in my head. Now all I think is RGB.<\/p>\n

Of course, that may now change because a fourth color, yellow, is being added to the mix. I’ll discuss the special new color additive on Wednesday’s blog post.<\/p>\n","protected":false},"excerpt":{"rendered":"

It feels like a Twilight Zone opening: There is a fourth color, beyond that known to computers. That color, is yellow.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-1323","post","type-post","status-publish","format-standard","hentry","category-main"],"_links":{"self":[{"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/1323","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1323"}],"version-history":[{"count":16,"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/1323\/revisions"}],"predecessor-version":[{"id":1344,"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/1323\/revisions\/1344"}],"wp:attachment":[{"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1323"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1323"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wambooli.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1323"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}