git.iko.soy/elk
on 63243ca help sign in
elk/libraries/Color.elm
174 lines 5.0 kB history raw
1module Color where
3{-| Library for working with colors. Includes
4[RGB](https://en.wikipedia.org/wiki/RGB_color_model) and
5[HSV](http://en.wikipedia.org/wiki/HSL_and_HSV) creation, gradients, and
6built-in names.
8# Creation
9@docs rgb, rgba, hsv, hsva, greyscale, grayscale
11# From Other Colors
12@docs complement
14# Gradients
15@docs linear, radial
17# Built-in Colors
18These colors come from the [Tango
19palette](http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines)
20which provides aesthetically reasonable defaults for colors. Each color also
21comes with a light and dark version.
23### Standard
24@docs red, orange, yellow, green, blue, purple, brown
26### Light
27@docs lightRed, lightOrange, lightYellow, lightGreen, lightBlue, lightPurple,
28 lightBrown
30### Dark
31@docs darkRed, darkOrange, darkYellow, darkGreen, darkBlue, darkPurple,
32 darkBrown
34### Eight Shades of Grey
35These colors are a compatible series of shades of grey, fitting nicely
36with the Tango palette.
37@docs white, lightGrey, grey, darkGrey, lightCharcoal, charcoal, darkCharcoal, black
39These are identical to the *grey* versions. It seems the spelling is regional, but
40that has never helped me remember which one I should be writing.
41@docs lightGray, gray, darkGray
43-}
45import Native.Color
46import Basics ((-))
48data Color = Color Int Int Int Float
50{-| Create RGB colors with an alpha component for transparency.
51The alpha component is specified with numbers between 0 and 1. -}
52rgba : Int -> Int -> Int -> Float -> Color
53rgba = Color
55{-| Create RGB colors from numbers between 0 and 255 inclusive. -}
56rgb : Int -> Int -> Int -> Color
57rgb r g b = Color r g b 1
59lightRed : Color
60lightRed = Color 239 41 41 1
61red : Color
62red = Color 204 0 0 1
63darkRed : Color
64darkRed = Color 164 0 0 1
66lightOrange : Color
67lightOrange = Color 252 175 62 1
68orange : Color
69orange = Color 245 121 0 1
70darkOrange : Color
71darkOrange = Color 206 92 0 1
73lightYellow : Color
74lightYellow = Color 255 233 79 1
75yellow : Color
76yellow = Color 237 212 0 1
77darkYellow : Color
78darkYellow = Color 196 160 0 1
80lightGreen : Color
81lightGreen = Color 138 226 52 1
82green : Color
83green = Color 115 210 22 1
84darkGreen : Color
85darkGreen = Color 78 154 6 1
87lightBlue : Color
88lightBlue = Color 114 159 207 1
89blue : Color
90blue = Color 52 101 164 1
91darkBlue : Color
92darkBlue = Color 32 74 135 1
94lightPurple : Color
95lightPurple = Color 173 127 168 1
96purple : Color
97purple = Color 117 80 123 1
98darkPurple : Color
99darkPurple = Color 92 53 102 1
101lightBrown : Color
102lightBrown = Color 233 185 110 1
103brown : Color
104brown = Color 193 125 17 1
105darkBrown : Color
106darkBrown = Color 143 89 2 1
108black : Color
109black = Color 0 0 0 1
110white : Color
111white = Color 255 255 255 1
113lightGrey : Color
114lightGrey = Color 238 238 236 1
115grey : Color
116grey = Color 211 215 207 1
117darkGrey : Color
118darkGrey = Color 186 189 182 1
120lightGray : Color
121lightGray = Color 238 238 236 1
122gray : Color
123gray = Color 211 215 207 1
124darkGray : Color
125darkGray = Color 186 189 182 1
127lightCharcoal : Color
128lightCharcoal = Color 136 138 133 1
129charcoal : Color
130charcoal = Color 85 87 83 1
131darkCharcoal : Color
132darkCharcoal = Color 46 52 54 1
134{-| Produce a gray based on the input. 0 is white, 1 is black. -}
135grayscale : Float -> Color
136grayscale p = hsv 0 0 (1-p)
138greyscale : Float -> Color
139greyscale p = hsv 0 0 (1-p)
141{-| Produce a “complementary color”.
142The two colors will accent each other. -}
143complement : Color -> Color
144complement = Native.Color.complement
146{-| Create [HSV colors](http://en.wikipedia.org/wiki/HSL_and_HSV)
147with an alpha component for transparency. -}
148hsva : Float -> Float -> Float -> Float -> Color
149hsva = Native.Color.hsva
151{-| Create [HSV colors](http://en.wikipedia.org/wiki/HSL_and_HSV). This is very
152convenient for creating colors that cycle and shift. Hue is an angle and should
153be given in standard Elm angles (radians). -}
154hsv : Float -> Float -> Float -> Color
155hsv = Native.Color.hsv
157data Gradient
158 = Linear (Float,Float) (Float,Float) [(Float,Color)]
159 | Radial (Float,Float) Float (Float,Float) Float [(Float,Color)]
161{-| Create a linear gradient. Takes a start and end point and then a series of
162“color stops” that indicate how to interpolate between the start and
163end points. See [this example](/edit/examples/Elements/LinearGradient.elm) for a
164more visual explanation. -}
165linear : (number, number) -> (number, number) -> [(Float,Color)] -> Gradient
166linear = Linear
168{-| Create a radial gradient. First takes a start point and inner radius. Then
169takes an end point and outer radius. It then takes a series of “color
170stops” that indicate how to interpolate between the inner and outer
171circles. See [this example](/edit/examples/Elements/RadialGradient.elm) for a
172more visual explanation. -}
173radial : (number,number) -> number -> (number,number) -> number -> [(Float,Color)] -> Gradient
174radial = Radial