Archive for December, 2011

When you have 255 units of red, 255 units of blue and 255 units of green you obtain white, meaning Light. Once again in real life things are a bit different. Observe a rainbow and you’ll see more than red, green and blue. But for web purposes, white is achieved when all three are combined at their maximum number of units which is 255.

Now what happens if there is zero of red, green or blue? Try it out and you’ll see that with boxes RGB at zero in each you will get black.

This finishes the basics section of our introductory lessons. Now we will explore  grayscale, achromatic colors and value-saturation box in detail.

Read Full Post »

Feel free to try differnt colors at ColorExplorer and see how RGB boxes change. You will notice that each box never goes over the number 255. You would never see anything going over 255 in either red, green or blue. But what happens if RGB box has 255 units of red, 255 units of blue and 255 units of green? Try it out.

ColorExplorer has two boxes, the spectrum rectangle and the value-saturation square.

The spectrum rectangle is respnsible for hues. Observe the box ‘H’ when you move the curser upward or downward the spectrum rectangle . Now, move the curser inside value-saturation square and pay attention to box “H’. You will notice that when you move curser insde value-saturation square, ‘H’ box values do not change.

In both cases RGB values change. I’ll explain why later.

Consider each hue as a house with its specific address on the visible spectrum rectangle. The value-saturation square shows what you can find inside that house. More specifically, RGB, Value and Saturation. We’ll get to these later.

Hue at its purest form is always located on the upper right corner of the value-saturation square. ‘H’ value will indicate the degree and RGB will show you the amounts of red, green and blue present at any location of the value-saturation square.


1. Secret color at H = 60 degrees has (Remember, for now, S and V should always be at 100)

a. 200 red, 50 blue, 60 green

b. 255 red. 255 green


2. If R = 255, G = 0 and blue = 255 what will you see in HSV boxes?

a. H = 10, S = 100, V = 100

b. H = 240, S = 100, V = 100

c. H = 300, S = 100, V = 100

d, H = 60, S = 100, V = 100

c. 60 red, 200 gree, 255 blue

d. 90 red, 50 green, 60 blue


What color is at R = 255, B = 255, G = 255?

What color is at R = 0, B = 0, G = 0?

Read Full Post »

If you look at web color wheel, you will notice that along its rim it has three colored lines, red, green and blue.

Each line begins at specific location and slowly receeds until it completely dissapears. Colors on a colorwheel are composed of various proportions of either red, green, or blue or mixes of them. It is not simple to understand right away but series of examples will make it very simple.  Mixing red, blue and green  works for web. In the real world of painting things are a bit different. What I like about web colors is that  I can create a refernce models which I can try to recreate with paints or pencils, chemical composition of which influences its hues.

 So, let’s examine two reds from Lesson 2 – Color – Hues and their Borders. Lets take a hue at 340 degrees.  Lets examine RGB boxes. You will notice that the value for R is equal to 255, the value for G is zero and the value for B is equal 85. So the hue at 340 degees has 255 units of red, 85 units of blue and zero for green. Feel free to make an observation of rgb values at 19 degrees.


At ‘H’ = 19 degrees and S = V = 100, the border will have

a. R = 255, G = 255, B = 30

b. R = 255, G = 0, B = 50

c. R = 255, G = 189, B = 0

d R = 255, G = 81, B = 0

Read Full Post »

Once you know where to find borders of hues on the Spectrum Wheel, it should be easier for you to estimate how many hue families are there. Artists decided to divide the visible color spectrum into 12 color families. These families form a color wheel which is very useful for any artist or designer. So, as you can see, we do not need to worry about every single color on a spectrum. Twelve families will do. However, there is a problem. Do you remember that in Lesson 2 I gave you an example of borders?  You probably noticed that opposite sides of a red “pizza slice’  do not have the same type of red. They look completely different from each other. To know why you will need to go to the next post Lesson 4 – Color – Hue and RGB.

Read Full Post »

So, what is a border between red and orange? Where it begins and ends? What are the borders of each hue? To answer this question, I decided to try ColorExplorer. It actually gives the name of the color to its corresponding degree. Based on ColorExplorer, red begings at 340 degrees and ends at 19 degrees. White arrow shows you the location of the box for Hue.  Please note that the hue will always be expressed in degrees, from 0 to 360. Circled in red is number corresponding to a specific degree on the visible spectrum wheel.


Where does blue beginds and ends?

a. 200 – 259

b. 180 – 210

c. 200 – 240

d. 199 – 259

Read Full Post »

Part 1

Why Is It Important: Learning to distinguish grayscale values develops skill of observation.  It is useful when you draw objects lit thorough different sources of light. It helps you to distinguish the value of highlight, reflected light or a shade. Seeing right midtone values is a key to realistic drawings.

Experiment: Let’s go to ColorExplorer website and pick one hue, lets say red. On the left side of the box, you will notice that hue turns into white, gray and black. Move the curser up and down along the left rim of the square. Observe RGB values, which stand for red/green/blue. What do you notice? You will notice that when you move your curser from the top left angle towards the bottom left angle, red, green and blue values recede and eventually turn to zero.

Discussion: Black is absence of color. In this case, since it’s a computer system and not the real world, it means that black does not have  red, green or blue. White is composed of of all color. In computer world it means that white has maximum capacity(255)  of red, green and blue. Rainbow is a good example on how white light is composed of different colors.

Part 2

Try Out: Divide the grayscale into 8 parts and create a color reference grid such that white is a number one and black is a number eight. Create different tones of grayscale. If you decided to use ColorExplorer, then you can proceed the following way. Divide 255 of red, green and blue(maximum for color in computers) by 8. You’ll have an amount equal to approximately 32. Take a midpoint of 32 and record that information for your grid.

Discussion: Grayscale grid is achromatic (no hue) value range. Any RGB value from 0 to 128 is called shade and any value from RGB128 and up are called tints. Left side of color square is actually a value grid and it is usually measured in percentages. In the exerciced, if you used the ColorExplorer, you probably noticed that when you canged RGB values, the Value box also changed numbers. It actually shows the percentage of white (all color) within that value grid.

Part 3

Use Your Knowledge: This is a grayscale copy of a painting done by Kangin, O. Winter. First, look at your grayscale grid and try to identify values on this picture. Second, record them, you can write on this picture. Third, create a rough sketch. Don’t pay attention to details, jsut spots with values.


Read Full Post »

Hue  is a property of a color , as yellow is a property of a color or red is a property of a color. 

 A visible spectrum wheel shows different hues. The wheel is separated in 360 degrees. It shows different hues at different degrees. For example red is at 0 degrees and orange is at 30. So anything in between is considered a separate hue. You may think that between red and orange there should be 30 hues, corresponding to degrees. In realilty there are more than 30, because some hues can be at 29.9999 degress. So, there are many hues between red and orange.

All hues are located at the edge of the spectrum wheel.

What is a ‘Vybrant Cyan’?

a. 180 degree

b. 220 degress

c. 300 degress

d. 0 degress

To answer that question feel free to browse ColorExplorer and type in the degrees into ‘H’ box. Makes sure that ‘S’ and ‘V’ boxes are at 100.

Read Full Post »