Create RGB colors from numbers between 0 and 255 inclusive.

Create RGB colors with an alpha component for transparency. The alpha component is specified with numbers between 0 and 1.

Create HSL colors. This gives you access to colors more like a color wheel, where all hues are aranged in a circle that you specify with standard Elm angles (radians).

red   = hsl (degrees   0) 1 0.5
green = hsl (degrees 120) 1 0.5
blue  = hsl (degrees 240) 1 0.5


pastelRed = hsl (degrees 0) 0.7 0.7

To cycle through all colors, just cycle through degrees. The saturation level is how vibrant the color is, like a dial between grey and bright colors. The lightness level is a dial between white and black.

Create HSL colors with an alpha component for transparency.

Produce a gray based on the input. 0 is white, 1 is black.

Produce a “complementary color”. The two colors will accent each other. This is the same as rotating the hue by 180°.

Create a linear gradient. Takes a start and end point and then a series of “color stops” that indicate how to interpolate between the start and end points. See this example for a more visual explanation.

Create a radial gradient. First takes a start point and inner radius. Then takes an end point and outer radius. It then takes a series of “color stops” that indicate how to interpolate between the inner and outer circles. See this example for a more visual explanation.

Extract the components of a color in the RGB format.

Extract the components of a color in the HSL format.