HTML and CSS Reference
In-Depth Information
Colors
The colors used by computers are represented by hexadecimal color codes that define the amounts of red, green, and
blue needed to create the desired color. This is great for computers, but the likelihood of humans remembering these
color codes is very slim. Giving users the capability to visually select a color previously required an elaborate
JavaScript solution that wasn't very developer friendly.
Luckily, HTML5 has come to the rescue with the
color
type for
<input>
elements. Using this type will trigger
the browser to display a button that can be used to launch a visual color picker. The user can then use this to pick the
color she wants, without having to deal with color codes. It's awesome!
Figure 6-8 shows the button and color picker that are displayed in Google Chrome on
Mac OS X.
Here is an example of a basic
<input>
element with the type
color
.
<input
type="color"
name="favColor" id="favColor">
Figure 6-8
An input element with the type color, as displayed in Google Chrome on Mac OS X.