0% found this document useful (0 votes)
25 views

Lesson 11

This document discusses color psychology and perception as well as HTML color specification. It covers the influence of colors on human behavior and perception. It also describes 4 ways to specify colors in HTML - color names, hexadecimal codes, RGB values, and HSL values. Examples are provided for each color specification method. Exercises are included to practice applying color values.

Uploaded by

Sir G Online
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
25 views

Lesson 11

This document discusses color psychology and perception as well as HTML color specification. It covers the influence of colors on human behavior and perception. It also describes 4 ways to specify colors in HTML - color names, hexadecimal codes, RGB values, and HSL values. Examples are provided for each color specification method. Exercises are included to practice applying color values.

Uploaded by

Sir G Online
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 10

Lesson 11

Colors

By
Sir G
Santoyo
S.Y. 2023 - 2024
Table of Content
• Objectives
• The Psychology and Perception
of Colors
• HTML Colors
Psychology of Colors Perception of Color Red
1. Colors can influence human
behavior.
2. Colors can influence human
perceptions.
3. Colors can influence the taste
of food.
4. Colors can influence
attractiveness
Perception of Color Perception of Color Blue
Green
Perception of Color Perception of Color Gray
Yellow
Perception of Color Perception of Color
White Black
HTML Colors 4 ways to specify
HTML color can be used by thru the HTML color
use of Color and Background-color
properties of Style element or Style 1. There a total of 140 Color
properties. Names
Examples: 2. Hexadecimal
3. RGB Color
<p style=“color:red”> </p> 4. HSL Color

<body style=“background-
color:red:>
</body>
RGB Colors Example of RGB color
An RGB color value represents
<p style=“color:rgb(0, 0, 255)”>This
RED, GREEN, and BLUE light
is Blue </p>
sources.
<body style=“background-
An RGBA color value is an
color:rgb(255,0,0)”>
extension of RGB with an Alpha
</body>
channel (opacity).

Each parameter (red, green, and


blue) defines the intensity of the
color with a value between 0 and
255.

This means that there are 256 x


256 x 256 = 16,777,216 possible
colors!
Hexadecimal Colors Example of Hex color
In HTML, a color can be specified
<p style=“color:#9966cc”>This is
using a hexadecimal value in the
Amethyst </p>
form:
<body style=“background-
#rrggbb color:#ff0000”>
</body>
Where rr (red), gg (green) and bb
(blue) are hexadecimal values
between 00 and ff (same as
decimal 0-255).
Exercises 4. Set the border to 2 pixels thick, and
color to blue
1. Insert the correct HEX value to
make the text color green.
<td style=“border: 2px solid blue”>

<p style=“color:#00ff00“>hello
world</p>
2. Set the background color of the web
page document to yellow.

<body style=“background-color:yellow”>

3. Set the text color to red

<body style=“color:red”>

You might also like