@@ -55,6 +55,31 @@ rgba = RGBA
5555rgb : Int -> Int -> Int -> Color
5656rgb r g b = RGBA r g b 1
5757
58+{-| Create [HSL colors](http://en.wikipedia.org/wiki/HSL_and_HSV)
59+with an alpha component for transparency.
60+-}
61+hsla : Float -> Float -> Float -> Float -> Color
62+hsla hue saturation lightness alpha =
63+ HSLA (hue - toFloat (floor (hue / (2*pi)))) saturation lightness alpha
64+
65+{-| Create [HSL colors](http://en.wikipedia.org/wiki/HSL_and_HSV). This gives
66+you access to colors more like a color wheel, where all hues are aranged in a
67+circle that you specify with standard Elm angles (radians).
68+
69+ red = hsl (degrees 0) 1 0.5
70+ green = hsl (degrees 120) 1 0.5
71+ blue = hsl (degrees 240) 1 0.5
72+
73+ pastelRed = hsl (degrees 0) 0.7 0.7
74+
75+To cycle through all colors, just cycle through degrees. The saturation level
76+is how vibrant the color is, like a dial between grey and bright colors. The
77+lightness level is a dial between white and black.
78+-}
79+hsl : Float -> Float -> Float -> Color
80+hsl hue saturation lightness =
81+ hsla hue saturation lightness 1
82+
5883{-| Produce a gray based on the input. 0 is white, 1 is black. -}
5984grayscale : Float -> Color
6085grayscale p = HSLA 0 0 (1-p) 1
@@ -72,21 +97,6 @@ complement color =
7297 RGBA r g b a -> let (h,s,l) = rgbToHsl r g b
7398 in hsla (h + degrees 180) s l a
7499
75−{-| Create [HSL colors](http://en.wikipedia.org/wiki/HSL_and_HSV)
76−with an alpha component for transparency.
77−-}
78−hsla : Float -> Float -> Float -> Float -> Color
79−hsla hue saturation lightness alpha =
80− HSLA (hue - toFloat (floor (hue / (2*pi)))) saturation lightness alpha
81−
82−{-| Create [HSL colors](http://en.wikipedia.org/wiki/HSL_and_HSV). This is very
83−convenient for creating colors that cycle and shift. Hue is an angle and should
84−be given in standard Elm angles (radians).
85−-}
86−hsl : Float -> Float -> Float -> Color
87−hsl hue saturation lightness =
88− hsla hue saturation lightness 1
89−
90100{-| Extract the the components of a color in the HSL format.
91101-}
92102toHsl : Color -> { hue:Float, saturation:Float, lightness:Float, alpha:Float }