<!DOCTYPE html">
<html">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="pagestyle.css"/>
<script src="colorSetter.js"></script>
<title>Color Checker</title>
</head>
<body>
<h1>Trying Out Colors</h1>
<p>Colors in a Web page are given as three numbers, one each for three primary
colors—red, green, and blue in this case—from which all other colors
can be generated. We will discuss this more in another section. For now, just recognize
that each color can be specified as a two-digit hexadecimal number. </p>
<h2>Using Hexadecimal Numbers to Specify Colors</h2>
<p>What's a hexadecimal number? Well, it is a number written in the
base 16 system rather than our usual decimal (base 10 system). Whereas decimal numbers
are contructed from the 10 digits</p>
<blockquote>
<p>0, 1, 2, 3, 4, 5, 6, 7, 8, 9</p>
</blockquote>
<p>numbers in the hexadecimal system are constructed from the 16 digits</p>
<blockquote>
<p>0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, and F</p>
</blockquote>
<p>Web colors can be represented with a 6-digit hexadecimal number preceded by the #
symbol so that the browser knows that the number is a hexadecimal number. So #45F89A
is a hexidecimal number can refer to a color, where the first two digits—45—
represent the amount of red, the second two digits—F8—represent the
amount of green, and the last two digits—9A—represent the amount of
blue in the combined color. We can use the rectangle below to test different colors.</p>
<h2>Try it</h2>
<p>Hover your mouse over the rectangle. A dialog box will appear. Enter a valid
hexadecimal number to see what color shows up in the rectangle.</p>
<div id="colorPanel" onMouseOver="colorSetter()">
</div>
<p> </p>
</body>
</html>