Discussion: CSS color parser

[kuon]

My use case for CSS color parser is a WYSIWYG editor that produces CSS colors, the rendering is done in elm, I adjust some of the colors before rendering (like ensuring contrast...), that's where I need a CSS color parser.

Follow up of: https://github.com/avh4/elm-color/issues/4#issuecomment-419789478

[gampleman]

I would definitely use this in my project. I think css colors are a de-facto interchange format for colors on the web, so if you need interop with a system you don't control, CSS colors are going to come into play.

Whether it should be in the core package is another question. Personally I'm a fan of a batteries included approach, so would support that.

[avh4]

@kuon you mentioned you possibly had some existing code for this? Can you list the formats that it's able to parse?

[kuon]

rgb() rgba() hsl() hsla() and hex (both percentage and 0-255 ranges) it was written for 0.18

https://gist.github.com/kuon/19b14cd5f913c8b60c08dbbdb0156514

Consider it BSD3 licensed.

I read your hex parser and I think yours is better as it uses pattern matching instead of regex.

[gampleman]

You should probably also include keyword colors in the parser:

Example using elm/parser

```elm keywords : Parser Color keywords = oneOf [ fromHexString "#000000" |. keyword "black" , fromHexString "#c0c0c0" |. keyword "silver" , fromHexString "#808080" |. keyword "gray" , fromHexString "#ffffff" |. keyword "white" , fromHexString "#800000" |. keyword "maroon" , fromHexString "#ff0000" |. keyword "red" , fromHexString "#800080" |. keyword "purple" , fromHexString "#ff00ff" |. keyword "fuchsia" , fromHexString "#008000" |. keyword "green" , fromHexString "#00ff00" |. keyword "lime" , fromHexString "#808000" |. keyword "olive" , fromHexString "#ffff00" |. keyword "yellow" , fromHexString "#000080" |. keyword "navy" , fromHexString "#0000ff" |. keyword "blue" , fromHexString "#008080" |. keyword "teal" , fromHexString "#00ffff" |. keyword "aqua" , fromHexString "#ffa500" |. keyword "orange" , fromHexString "#f0f8ff" |. keyword "aliceblue" , fromHexString "#faebd7" |. keyword "antiquewhite" , fromHexString "#7fffd4" |. keyword "aquamarine" , fromHexString "#f0ffff" |. keyword "azure" , fromHexString "#f5f5dc" |. keyword "beige" , fromHexString "#ffe4c4" |. keyword "bisque" , fromHexString "#ffebcd" |. keyword "blanchedalmond" , fromHexString "#8a2be2" |. keyword "blueviolet" , fromHexString "#a52a2a" |. keyword "brown" , fromHexString "#deb887" |. keyword "burlywood" , fromHexString "#5f9ea0" |. keyword "cadetblue" , fromHexString "#7fff00" |. keyword "chartreuse" , fromHexString "#d2691e" |. keyword "chocolate" , fromHexString "#ff7f50" |. keyword "coral" , fromHexString "#6495ed" |. keyword "cornflowerblue" , fromHexString "#fff8dc" |. keyword "cornsilk" , fromHexString "#dc143c" |. keyword "crimson" , fromHexString "#00ffff" |. keyword "cyan" , fromHexString "#00008b" |. keyword "darkblue" , fromHexString "#008b8b" |. keyword "darkcyan" , fromHexString "#b8860b" |. keyword "darkgoldenrod" , fromHexString "#a9a9a9" |. keyword "darkgray" , fromHexString "#006400" |. keyword "darkgreen" , fromHexString "#a9a9a9" |. keyword "darkgrey" , fromHexString "#bdb76b" |. keyword "darkkhaki" , fromHexString "#8b008b" |. keyword "darkmagenta" , fromHexString "#556b2f" |. keyword "darkolivegreen" , fromHexString "#ff8c00" |. keyword "darkorange" , fromHexString "#9932cc" |. keyword "darkorchid" , fromHexString "#8b0000" |. keyword "darkred" , fromHexString "#e9967a" |. keyword "darksalmon" , fromHexString "#8fbc8f" |. keyword "darkseagreen" , fromHexString "#483d8b" |. keyword "darkslateblue" , fromHexString "#2f4f4f" |. keyword "darkslategray" , fromHexString "#2f4f4f" |. keyword "darkslategrey" , fromHexString "#00ced1" |. keyword "darkturquoise" , fromHexString "#9400d3" |. keyword "darkviolet" , fromHexString "#ff1493" |. keyword "deeppink" , fromHexString "#00bfff" |. keyword "deepskyblue" , fromHexString "#696969" |. keyword "dimgray" , fromHexString "#696969" |. keyword "dimgrey" , fromHexString "#1e90ff" |. keyword "dodgerblue" , fromHexString "#b22222" |. keyword "firebrick" , fromHexString "#fffaf0" |. keyword "floralwhite" , fromHexString "#228b22" |. keyword "forestgreen" , fromHexString "#dcdcdc" |. keyword "gainsboro" , fromHexString "#f8f8ff" |. keyword "ghostwhite" , fromHexString "#ffd700" |. keyword "gold" , fromHexString "#daa520" |. keyword "goldenrod" , fromHexString "#adff2f" |. keyword "greenyellow" , fromHexString "#808080" |. keyword "grey" , fromHexString "#f0fff0" |. keyword "honeydew" , fromHexString "#ff69b4" |. keyword "hotpink" , fromHexString "#cd5c5c" |. keyword "indianred" , fromHexString "#4b0082" |. keyword "indigo" , fromHexString "#fffff0" |. keyword "ivory" , fromHexString "#f0e68c" |. keyword "khaki" , fromHexString "#e6e6fa" |. keyword "lavender" , fromHexString "#fff0f5" |. keyword "lavenderblush" , fromHexString "#7cfc00" |. keyword "lawngreen" , fromHexString "#fffacd" |. keyword "lemonchiffon" , fromHexString "#add8e6" |. keyword "lightblue" , fromHexString "#f08080" |. keyword "lightcoral" , fromHexString "#e0ffff" |. keyword "lightcyan" , fromHexString "#fafad2" |. keyword "lightgoldenrodyellow" , fromHexString "#d3d3d3" |. keyword "lightgray" , fromHexString "#90ee90" |. keyword "lightgreen" , fromHexString "#d3d3d3" |. keyword "lightgrey" , fromHexString "#ffb6c1" |. keyword "lightpink" , fromHexString "#ffa07a" |. keyword "lightsalmon" , fromHexString "#20b2aa" |. keyword "lightseagreen" , fromHexString "#87cefa" |. keyword "lightskyblue" , fromHexString "#778899" |. keyword "lightslategray" , fromHexString "#778899" |. keyword "lightslategrey" , fromHexString "#b0c4de" |. keyword "lightsteelblue" , fromHexString "#ffffe0" |. keyword "lightyellow" , fromHexString "#32cd32" |. keyword "limegreen" , fromHexString "#faf0e6" |. keyword "linen" , fromHexString "#ff00ff" |. keyword "magenta" , fromHexString "#66cdaa" |. keyword "mediumaquamarine" , fromHexString "#0000cd" |. keyword "mediumblue" , fromHexString "#ba55d3" |. keyword "mediumorchid" , fromHexString "#9370db" |. keyword "mediumpurple" , fromHexString "#3cb371" |. keyword "mediumseagreen" , fromHexString "#7b68ee" |. keyword "mediumslateblue" , fromHexString "#00fa9a" |. keyword "mediumspringgreen" , fromHexString "#48d1cc" |. keyword "mediumturquoise" , fromHexString "#c71585" |. keyword "mediumvioletred" , fromHexString "#191970" |. keyword "midnightblue" , fromHexString "#f5fffa" |. keyword "mintcream" , fromHexString "#ffe4e1" |. keyword "mistyrose" , fromHexString "#ffe4b5" |. keyword "moccasin" , fromHexString "#ffdead" |. keyword "navajowhite" , fromHexString "#fdf5e6" |. keyword "oldlace" , fromHexString "#6b8e23" |. keyword "olivedrab" , fromHexString "#ff4500" |. keyword "orangered" , fromHexString "#da70d6" |. keyword "orchid" , fromHexString "#eee8aa" |. keyword "palegoldenrod" , fromHexString "#98fb98" |. keyword "palegreen" , fromHexString "#afeeee" |. keyword "paleturquoise" , fromHexString "#db7093" |. keyword "palevioletred" , fromHexString "#ffefd5" |. keyword "papayawhip" , fromHexString "#ffdab9" |. keyword "peachpuff" , fromHexString "#cd853f" |. keyword "peru" , fromHexString "#ffc0cb" |. keyword "pink" , fromHexString "#dda0dd" |. keyword "plum" , fromHexString "#b0e0e6" |. keyword "powderblue" , fromHexString "#bc8f8f" |. keyword "rosybrown" , fromHexString "#4169e1" |. keyword "royalblue" , fromHexString "#8b4513" |. keyword "saddlebrown" , fromHexString "#fa8072" |. keyword "salmon" , fromHexString "#f4a460" |. keyword "sandybrown" , fromHexString "#2e8b57" |. keyword "seagreen" , fromHexString "#fff5ee" |. keyword "seashell" , fromHexString "#a0522d" |. keyword "sienna" , fromHexString "#87ceeb" |. keyword "skyblue" , fromHexString "#6a5acd" |. keyword "slateblue" , fromHexString "#708090" |. keyword "slategray" , fromHexString "#708090" |. keyword "slategrey" , fromHexString "#fffafa" |. keyword "snow" , fromHexString "#00ff7f" |. keyword "springgreen" , fromHexString "#4682b4" |. keyword "steelblue" , fromHexString "#d2b48c" |. keyword "tan" , fromHexString "#d8bfd8" |. keyword "thistle" , fromHexString "#ff6347" |. keyword "tomato" , fromHexString "#40e0d0" |. keyword "turquoise" , fromHexString "#ee82ee" |. keyword "violet" , fromHexString "#f5deb3" |. keyword "wheat" , fromHexString "#f5f5f5" |. keyword "whitesmoke" , fromHexString "#9acd32" |. keyword "yellowgreen" , fromHexString "#663399" |. keyword "rebeccapurple" , succeed (Color 0 0 0 0) |. keyword "transparent" ] ```

[kuon]

Well wouldn't using a dict be faster for color names? I also think it should be case insensitive.

I used regex for my parser, but with elm/parser now available maybe it would be better to use it for the CSS formats.

[skyqrose]

My use case is interfacing with an existing system that uses css colors. I don't control that system so can't change it to a different format (nor would I want to, it's a totally reasonable choice in context.)

In my case, that information is coming in json, so my ideal situation would be to have a Decoder Color, but I'd be fine with any String -> Maybe Color or String -> Result Color. (I'd like to detect errors and fail the decoding rather than choose a default.)

Since this functionality is not exposed, I'm planning on reimplementing or copying an existing parser, which is not ideal.