I have an aplication in which the customer chooses a color. I can't let this color be too light. Is there a way to see this, to prevent the customer from chosing a color that is too light?
Thank you a lot!
too light in the case is a color almost white....i have a web site with a white background and the user can choose a color through a jquery plugin.
I want to allow the user to choose the color he wants, but cant be too light.
You can think of the RGB color space as a cube where each of the 3 colors are axis, in one corner you have black (RGB 0,0,0) and in the opposite corner you have white RGB (255,255,255), so if a color is closer to black it should be darker.
The intensity is the sum of the RGB values normalized to 1: 1 1= 3(R + G+ B).
A photometer measures the brightness (luminance) of visible light as it is perceived by the human eye. Colorimetry is the science of measuring color (chromaticity) as it is perceived by the human eye. Some instruments, such as a spot meter, can measure both luminance and chromaticity.
RGB defines the values of red (the first number), green (the second number), or blue (the third number). The number 0 signifies no representation of the color and 255 signifies the highest possible concentration of the color.
If contrast is what you are looking for then check out this article.
They show a function like this to choose text color based on any arbitrary color:
function isTooLightYIQ(hexcolor){
var r = parseInt(hexcolor.substr(0,2),16);
var g = parseInt(hexcolor.substr(2,2),16);
var b = parseInt(hexcolor.substr(4,2),16);
var yiq = ((r*299)+(g*587)+(b*114))/1000;
return yiq >= 128;
}
// usage:
element.style.color = isTooLightYIQ('ff0045') ? '#000' : '#fff';
The above function will return true if the color is too light for white text to be readable on top of this color.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With