2

I am trying to make a function in javascript that check how well a text show on its background. Example black(RGB(0,0,0)) text on white(RGB(255,255,255)) background is the best possible contrast. I would want my fn to return 100%. However if it was yellow text on green background how would I be able to determine how well those 2 colour contrast? I was thinking of (random example of two colours: 

|RGB(240,230,220) - RGB(220,130,255)| = RGB(20,100,35)
then
[RGB(20,100,35)/RGB(255,255,255)] = 8%,39%,14%
Average of [8%,39%,14%] = 20%

so those 2 colours are 20% contrast compatible. Is this the right way?

chomp chomp
  • 68
  • 6
  • 3
    no. rgb values aren't good for such things. convert to HSL and then it's a simple comparison of luminance values. – Marc B Mar 30 '15 at 19:03
  • 1
    http://stackoverflow.com/questions/9733288/how-to-programmatically-calculate-the-contrast-ratio-between-two-colors – blex Mar 30 '15 at 19:04
  • 1
    http://stackoverflow.com/questions/2353211/hsl-to-rgb-color-conversion to take one step further – Sai Mar 30 '15 at 19:04

0 Answers0