HTML5 and CSS3 beginner tutorial 15 - CSS colors

Показать описание

This tutorial shows you how to use colors in CSS. Hexadecimal, RGB and RGBA values are all covered.

Don't forget to tell them I sent you.

Follow me on social media:
Snapchat: quentinwatt92

Patrons can download the code here:

Become a Patron:

Subscribe to my Vlog channel:

Subscribe to this channel:

Please note:
I do not offer web development services, private tutoring, or "assistance" on school or university projects. I am not an online support service, and I'm not interested in setting up a "start up" business with viewers.

Рекомендации по теме

Комментарии

I used to teach colour theory in drama school design classes. So to answer your question about primary colours -- it depends on whether you're talking about colour addition or colour subtraction between the polar extremes of black and white.

In physics, something is white because it reflects all colours of light whereas something is black because it absorbs all colours of light. The colour itself is carried on a wavelength of visible light, so colour = light, at least in physics. The substance that reflects back the colour we see is called pigment.

In colour theory, all colour reduces to a value of grey on a continuum between white and black. On this continuum, white is regarded as positive (it is the highest value colour) and black as negative (it is the lowest value colour). Thus, combining different colours of light to produce white is called colour addition while combining different colours of pigment to make black is called colour subtraction.

In purely technical terms:
1) Red, green and blue are the primary colours because red light, green light and blue light combined add to white, i.e. they make white light (under laboratory conditions; elsewhere, you will actually get a very pale grey)
2) Red, yellow and blue are the primary pigments because red pigment, yellow pigment and blue pigment combined subtract to black, i.e. make black pigment (again, under laboratory conditions; elsewhere, you will actually get a very dark grey)

To avoid confusing our design students in the drama school, we distinguished the terms:
1) Primary colours in light (or 'of' light)
2) Primary colours in pigment

Semi-Theoretical note: If you ask a physics teacher, s/he will say the primary pigments are magenta, yellow and cyan. That is and is not true. If you're working within the province of colour addition, it is true. If you're working in thr province of colour subtraction, that statement is false.

Vital Distinction: Light is a form of energy. Pigment is matter. So, in terms of basic physics, when we're dealing with colour in light, we are dealing with energy. When we are dealing with colour in pigment, we are dealing with matter.

Working In the Province of Colour Addition:
The colours displayed on your computer monitor are created by colour addition. The computer does not paint pigment onto the back of your monitor screen but it projects different colours of light. (Well, technically the computer sends electrical signals to the monitor that get converted into light; but let's make life easy and say it "projects" the light.) And for that reason, printing from a computer also relies upon colour addition to produce a colour image. Again, the computer has no pigment that it can paint onto the paper you feed into your printer. Instead, it projects different colours of light to the printer (i.e. electrical impulses based upon colours of light), which must then be converted into the corresponding pigments within the vocabulary of colour addition. That is why computer printers use magenta, yellow and cyan ink instead of red, green and blue ink. The pigments that correspond to red light, green light and blue light within the vocabulary of colour addition are magenta pigment, yellow pigment, and cyan pigment.

Working in the Province of Colour Subtraction:
As with matter/anti-matter, the opposite principle from colour addition is at work in colour subtraction. Whereas in colour addition you are using light to manipulate the colour of pigment; in colour *subtraction* you are using pigment to manipulate the reflexion of light. You're doing essentially the same work but from the opposite direction and with the opposite pole of the colour value continuum in control; and that is what makes all the difference. Colour addition is oriented toward white. Colour subtraction is oriented toward black.

So whereas computer printers rely on colour addition because they have to print the light-based data a computer sends them, old-fashioned non-computer printing presses, offset printers, mimeograph and duplicator machines, etc., do not use magenta, yellow and cyan ink. They use red, yellow and blue ink. Likewise, painters - whether they work in oil, water, acrylic or other types of paint - use primary, secondary, tertiary, etc., colours within the vocabulary of colour subtraction not those within the vocabulary of colour addition.

FYI:
Primary colours in light (3): Red, Green, Blue
Secondary colours in light (3): Magenta (Red + Blue), Yellow (Red + Green), Cyan (Blue + Green)
Tertiary colours in light (6): Red-Magenta, Orange (Red + Yellow), Yellow-Green, Green-Cyan, Cyan-Blue, Violet aka Purple

Primary colours in pigment (3): Red, Yellow, Blue
Secondary colours in pigment (3): Orange (Red + Yellow), Green (Yellow + Blue), Violet aka Purple
Tertiary colours in pigment (6): Red-Orange, Orange-Yellow, Yellow-Green, Cyan, Indigo, Magenta

michealtmcloughlin

Thanks for such informative tutorials!!! ❤️

ashirali

Red Green Blue are primary colors in light. If you combine these three lightwaves you'll get white. Red Yellow Blue are primary colors in drawing. You can mix with ryb every color and with rgb light and because screens emit light rgb is more important or easier

mbakutchalla

Thank you so much for your tuts. Very helpfull! :-)

deepx

Please do Javascript and jqury project which explain all concept

Amol

There's a little program called ColorPic which lets you identify and save colors on the screen by name and hex code, lets you choose, identify, and save colors from an array and a slider control, organize them into palettes, etc.

DGardn