hsl intuitive color codes

Although computer colors are made by combining red, green, and blue (rgb) light, it can be more intuitive to think of a color in terms of its hue, saturation, and lightness.

The hsl function

The hsl function can be used to create a color code that can be used with dot or pen or fill:

c = hsl(270, .8, .5)

The program above specifies a purplish color. The "Hue" is a number that ranges from 0 to 360, representing a color on a color wheel (pictured below). "Saturation" is a number from 0 to 1 giving the intensitity of the color, and "Lightness" is a number from 0 to 1 which adjusts the color from blackness to whiteness.

Partial transparency using hsla

The hsla function can be used to create a partially transparent color code. The fourth component "a", or "alpha" value is an opacity level from 0.0 to 1.0 that determines how the color is mixed with the colors "underneath".

So, for example, if a dot is drawn with alpha 0.5, it is blended with the colors behind it:

bk 100
dot red, 200
fd 200
dot blue, 200
bk 100
dot(
  hsla(135, 0.8, 0.5, 0.5),
  200)