aware.hwg.org: accessible web authoring resources and education center
Current Location: HTML Writers Guild · AWARE · Colorlab · Docs · Overview

Color Laboratory Overview

Worth a Thousand Words

colorpicker frame controls frame swatches frame thanks frame (no documentation required)

Click on a frame in the screenshot below for more detail about that particular frame, or continue reading for an overview of the large-scale user interface elements in the color laboratory.

screenshot showing colorlab with zero swatches selected

The above image should look somewhat familiar. You should have seen something similar to the above when you first entered the color laboratory. This tool divides your browser into four frames. The bottom frame contains a 'thank you' to the creator of the original color lab. The next frame up contains a welcome message when one first enters the color laboratory. The top row contains a colorpicker frame on the left, and some additional controls one the right.

The bottom frame will always contain that thank you message. The upper-left frame will always contain a colorpicker palette. The upper-right frame's contents will change as you access different controls within the color laboratory, and the large middle frame's contents will change as you manipulate those controls and select swatches using the colorpicker palette. Below we see the color laboratory in a different configuration, after some usage.

screenshot showing colorlab in active use

Note that the upper-right frame contains different controls than you saw in the first image, and the large middle frame contains a handful of color swatches.

With this overview under your belt, you should be ready to jump directly into the quickstart section of the documentation, or read more about the colorpicker frame, the controls frame, or the swatches frame.

Next: Color Laboratory Quickstart