What if you don't have an online connection, or simply can't be arsed to fire up a memory-intensive program just to pick a color? You would have to have a good grasp of the RGB Color Model, so as to get a decent approximation of the color code needed.
Color codes are the bread and butter of layout designers. They are based off R, G and B values which make up every color in the RGB Color Model. These stand for Red, Green and Blue respectively. Each R, G and B component has 256 possible intensity values (00 to FF in Hexadecimal, 0 to 255 in Decimal), and in turn this allows for more than 16 million possible combinations. Cool, eh?
For instance, to obtain a lovely Blue-green, you would need Hexadecimal code #006699 or Decimal rgba(0,102,153,1). For ease of conversion between Hexadecimal and Decimal, check this table out.
Intensity plays a very important part in color-guessing. The lower the value, the less intense the RGB component is. So having all values at the lowest (Hexadecimal code #000000 or Decimal rgba(0,0,0,1)) would give you Black, and having all values at the highest (Hexadecimal code #FFFFFF or Decimal rgba(255,255,255,1)) would give you White.
| Color | Hexadecimal | Decimal | |||||
| R | G | B | R | G | B | A | |
| White | FF | FF | FF | 255 | 255 | 255 | 1 |
| Black | 00 | 00 | 00 | 0 | 0 | 0 | 1 |
Incidentally, having all RGB components at the same values, would give you varying shades of grey.
| Hexadecimal | Decimal |
| #FFFFFF | rgba(255,255,255,1) |
| #E0E0E0 | rgba(224,224,224,1) |
| #AAAAAA | rgba(170,170,170,1) |
| #6F6F6F | rgba(111,111,111,1) |
| #444444 | rgba(68,68,68,1) |
| #000000 | rgba(0,0,0,1) |
Yes, excluding Black and White, there would be 254 possible shades of grey in the RGB Color Model. Now, we're going to see what happens when we manipulate the intensity values of existing color codes. For example, Red would be #FF0000 or rgba(255,0,0,1), Green would be #00FF00 or rgba(0,255,0,1) and Blue would be #0000FF or rgba(0,0,255,1).
| Hexadecimal | Decimal | ||||
| #FF0000 | #00FF00 | #0000FF | rgba(255,0,0,1) | rgba(0,255,0,1) | rgba(0,0,255,1) |
| #FF4444 | #44FF44 | #4444FF | rgba(255,68,68,1) | rgba(68,255,68,1) | rgba(68,68,255,1) |
| #FF9999 | #99FF99 | #9999FF | rgba(255,153,153,1) | rgba(153,255,153,1) | rgba(153,153,255,1) |
| #FFA0A0 | #A0FFA0 | #A0A0FF | rgba(255,160,160,1) | rgba(160,255,160,1) | rgba(160,160,255,1) |
See what happened there? We manipulated the other RGB values, upping their intensity. This gave us lighter shades of Red, Green and Blue. So, what do you do when you want darker shades?
| Hexadecimal | Decimal | ||||
| #FF0000 | #00FF00 | #0000FF | rgba(255,0,0,1) | rgba(0,255,0,1) | rgba(0,0,255,1) |
| #A00000 | #00A000 | #0000A0 | rgba(160,0,0,1) | rgba(0,160,0,1) | rgba(0,0,160,1) |
| #990000 | #009900 | #000099 | rgba(153,0,0,1) | rgba(0,153,0,1) | rgba(0,0,153,1) |
| #440000 | #004400 | #000044 | rgba(68,0,0,1) | rgba(0,68,0,1) | rgba(0,0,68,1) |
What we did here was to keep the other RGB values at 0 while lowering the intensity in general. That was simple! Now, how about composite colors, where you combine intensities of more than one R, G or B component?
| Color | Hexadecimal | Decimal | |||||
| R | G | B | R | G | B | A | |
| Yellow | FF | FF | 00 | 255 | 255 | 0 | 1 |
| Magenta | FF | 00 | FF | 255 | 0 | 255 | 1 |
| Cyan | 00 | FF | FF | 0 | 255 | 255 | 1 |
So combining R and G gives us Yellow, combining R and B gives us Magenta, and combining G and B gives us Cyan! Now what happens if you want a color not in those combinations, for example, Orange? Well, Yellow is the closest color, so we'll extrapolate from there. There's more Red than Green in Orange, so what we'll do here is tinker with the RGB components and ensure that the R component is higher in intensity than the G component.
| Hexadecimal | Decimal |
| #FFFF00 | rgba(255,255,0,1) |
| #FFD000 | rgba(208,208,0,1) |
| #FF9900 | rgba(153,153,0,1) |
| #FF4400 | rgba(68,68,0,1) |
| #FF0000 | rgba(255,0,0,1) |
Voila! Orange! Various shades of orange, from blazing fire to pale sunshine! So the same principle applies to other colors - if you wanted a Deep Purple, you could tinker with the Magenta. If you wanted Blue-green (as with the very first color mentioned in this post), go mess with the Cyan!
Well done, lads. Let's go paint the town #FF0000!
T___T
T___T
No comments:
Post a Comment