Automating text color for good contrast ratio

Saksham Gupta
1 min readJun 24, 2018

--

As my sixth week of GSoC with phpMyAdmin has come to an end, I going to explain the problems faced and how I tackled them. The biggest problem I faced was calculating text colours with contrast ratio greater than 4.5 , while keeping in mind the colour scheme used. First I tried to use mix-blend-mode but it didn’t work out because I would have to add a span class for every text, which wasn’t feasible. So I created a new function which takes the background colour and compares with the calculated colour . If the contrast ratio is less than 4.5 it tweaks saturation and brightness till the required contrast ratio is achieved. This colour is achieved with a maximum iteration of 10. Now I have started creating Preview panels and would complete it this week, hopefully.

--

--

Saksham Gupta

Student at International Institute of Technology, Hyderabad | Tech Enthusiast