A library for creating and manipulating colors.
darken : Basics.Float -> Color -> Color
Decrease the lightning of a color
lighten : Basics.Float -> Color -> Color
Increase the lightning of a color
saturate : Basics.Float -> Color -> Color
Increase the saturation of a color
desaturate : Basics.Float -> Color -> Color
Decrease the saturation of a color
rotateHue : Basics.Float -> Color -> Color
Change the hue of a color. The angle value must be in degrees
fadeIn : Basics.Float -> Color -> Color
Increase the opacity of a color
fadeOut : Basics.Float -> Color -> Color
Decrease the opacity of a color
grayscale : Color -> Color
Convert the color to a greyscale version, aka set saturation to 0
scaleHsl : ( Basics.Float, Basics.Float, Basics.Float ) -> Color -> Color
Fluidly scale saturation, lightness and alpha channel.
That means that lightening an already-light color with scaleHsl
won’t change the lightness much, but lightening
a dark color by the same amount will change it more dramatically.
For example, the lightness of a color can be anywhere between 0 and 1.0. If scaleHsl (0, 0.4, 0) color
is called,
the resulting color’s lightness will be 40% of the way between its original lightness and 1.0. If
scaleHsl (0, -0.4, 0) color
is called instead, the lightness will be 40% of the way between the original
and 0.
The values of the supplied tuple scale saturation, lightness, and opacity, respectively, and have a valid range of -1.0 to 1.0.
This function is inspired by the Sass function scale-color.
scaleRgb : Basics.Float -> Basics.Float -> Basics.Float -> Basics.Float -> Color -> Color
Fluidly scale red, green, blue, and alpha channels.
That means that reddening a already-red color with scaleRgb
won’t change the redness much, but reddening a color
with little or no red by the same amount will change it more dramatically.
For example, the redness of a color can be anywhere between 0 and 255. If scaleRgb 0.4 0 0 0 color
is called,
the resulting color’s redness will be 40% of the way between its original redness and 255. If
scaleRgb -0.4 0 0 0 color
is called instead, the redness will be 40% of the way between the original
and 0.
The values of the supplied tuple scale red, green, blue, and alpha channels, respectively, and have a valid range of -1.0 to 1.0.
This function is inspired by the Sass function scale-color.
mix : Color -> Color -> Color
Mixes two colors together. This is the same as calling weightedMix
with a weight of 0.5.
weightedMix : Color -> Color -> Basics.Float -> Color
Mixes two colors together.
This function takes the average of each of the RGB components, weighted by a provided value between 0 and 1.0. The opacity of the colors is also considered when weighting the components.
The weight specifies the amount of the first color that should be included in the returned color. For example, a weight of 0.5 means that half the first color and half the second color should be used. A weight of 0.25 means that a quarter of the first color and three quarters of the second color should be used.
This function uses the same algorithm as the mix function in Sass.