5 ms·
Is it possible to know about a certain color if it's dark or light? My goal is to automatically determine whether to put a white or black text on top of a backg
by just-tom 5y ago
Is it possible to know about a certain color if it's dark or light? My goal is to automatically determine whether to put a white or black text on top of a background colored box based on the answer. Is it has something to do with the temperature? I'd expect to get some value below or above 0.5.
- exclipy 5y agoLook at the L for either LAB or LCH. It'll be between 0 and 100.
- Cyykratahk 5y agoA simple function is to calculate whether the total of each RGB channel reaches a certain threshold, with different weights given to each channel. For an example, see the YIQ contrast function used by Bootstrap v4 [0]. WCAG defines their own algorithm for calculating the contrast between two colours to ensure good accessibility [1][2]. Bootstrap v5 uses this [3]. [0] https://github.com/twbs/bootstrap/blob/v4.6.1/scss/_functions.scss#L72-L85 https://github.com/twbs/bootstrap/blob/v4.6.1/scss/_function... [1] https://www.w3.org/WAI/GL/wiki/Relative_luminance https://www.w3.org/WAI/GL/wiki/Relative_luminance [2] https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests [3] https://github.com/twbs/bootstrap/blob/v5.1.3/scss/_functions.scss#L146-L202 https://github.com/twbs/bootstrap/blob/v5.1.3/scss/_function...
- pabue 5y agoGreat idea. I think this will fit nicely with the info tool. Also a accessibility contrast score might also be helpful. I will take a look at that. Thanks!