Validating css color names

Question

I've written a jQuery plugin that accepts css colors for some of its parameters.

I want to validate them. If it was just a hex or rgb value I could do that with a regular expression, but how do I validate all 147 valid color names without bloating the plugin?

I was wondering if there is some way of attempting to apply a style (maybe with jquery) and then catching an error from the browser if it is not valid?

Edit: powtac and Pantelis came up with a solution, but they both missed edge cases, so I am including a full solution here:

var validateCssColour = function(colour){     var rgb = $('<div style="color:#28e32a">');     // Use a non standard dummy colour to ease checking for edge cases     var valid_rgb = "rgb(40, 227, 42)";     rgb.css("color", colour);     if(rgb.css('color') == valid_rgb && colour != ':#28e32a' && colour.replace(/ /g,"") != valid_rgb.replace(/ /g,""))         return false;     else         return true; }; 

Answer 1

All of the solutions posted on this page are incorrect when the string in question is the same colour as the test colour. Granted, you could use a very unlikely choice of colour, but I would prefer to go for 100% success rate.

OP has a single typo in his code (see condition with colon), and does not test for "#28e32a", so that colour will fail, and the regex will collapse whitespace within the colour, so "#28e 32a" would (incorrectly) pass.

In normal JavaScript, this should have 100% success:

function validTextColour(stringToTest) {     //Alter the following conditions according to your need.     if (stringToTest === "") { return false; }     if (stringToTest === "inherit") { return false; }     if (stringToTest === "transparent") { return false; }      var image = document.createElement("img");     image.style.color = "rgb(0, 0, 0)";     image.style.color = stringToTest;     if (image.style.color !== "rgb(0, 0, 0)") { return true; }     image.style.color = "rgb(255, 255, 255)";     image.style.color = stringToTest;     return image.style.color !== "rgb(255, 255, 255)"; } 

JSFiddle: http://jsfiddle.net/WK_of_Angmar/xgA5C/