DEV Community

Discussion on: Changing text colour based on background colour luminosity

Collapse
 
grahamthedev profile image
GrahamTheDev • Edited

See I like the concept, but (and I could be reading it wrong) - does this not start failing the closer a colour has to a luminance of 127?

Instead, perhaps you could do something where you try and make the luminance +100, if it goes over 255 then try - 100?

That way you should always get good contrast?

Collapse
 
jamiemcmanus profile image
Jamie Mc Manus

I can't believe I didn't notice that, thanks !

I have adjusted the code to add additional contrast.

Collapse
 
grahamthedev profile image
GrahamTheDev

I think you made another minor mistake 😜🀣

If you get a 220 luminosity result you are trying to add 100 to it and capping at 255. I think all you have done is swap your greater thans and less thans by mistake!

Also with the way you have done it you could actually just do

Less than 127, add 100. Greater than 127, remove 100. You will never go out of bounds so you don’t need the additional checks. (126+100 or 127 - 100, it will always be within 0 to 255.)