Terrence Dorsey Writer. Editor. Nerd.

Interaction of Color

I have recently been reading through Josef Albers’ book Interaction of Color and working through some of the proposed exercies. It seemed obvious that, rather than cobbling together bits of colored paper, a web page could easily generate any number of possible color combinations.

So I built a simple page that dynamically generates the swatches described in Albers’ first exercise: https://terrencedorsey.com/albers/albers.html

You’ll see two large fields of different colors and a small, central swatch. This central swatch is the same color within both larger fields. Notice how, depending on the surrounding colors, the central color may look different — lighter, darker, or even a slightly different shade.

Each time you refresh the page it generates a different, random selection of colors. Hex values for the generated colors are provided at the bottom of the page.

There’s a fiddle if you want to play with the code: https://jsfiddle.net/tpdorsey/wqo15gb5/

Albers Color Swatches