Différences

Cette page vous donne les différences entre la révision choisie et la version actuelle de la page.

contrast [2010/01/31 10:16] (Version actuelle)
Ligne 1: Ligne 1:
 +===== Color Contrast =====
 +
 +It seems there are several steps to the calculation of color contrast:
 +
 +  * Convert from 0-255 values to 0-1 values:
 +    * <jsm>R_{sRGB} = R_{8bit} / 255</jsm> 
 +    * <jsm>G_{sRGB} = G_{8bit} / 255</jsm>
 +    * <jsm>B_{sRGB} = B_{8bit} / 255</jsm>
 +  * Adjust that conversion for some non-linearity:
 +    * If <jsm>R_{sRGB} \leq 0.03928</jsm> then <jsm>R = R_{sRGB} / 12.92</jsm>, <jsm>R=\left(\left(R_{sRGB} +0.055\right)/1.055\right)^{2.4}</jsm> otherwise.
 +    * Same adjustment for G and B.
 +  * Calculate the luminosity using this weighting of R, G and B:
 +    * <jsm>L_1 = 0.2126\times R + 0.7152 \times G + 0.0722 \times B </jsm>
 +  * Do the same for the background (or adjacent object with with you want to check the contrast). Calculate the ratio: <jsm>\displaystyle \frac{L_1 + 0.05}{L_2 + 0.05}</jsm>. The ratio should be greater than 3 for type 14pt or larger if boldface, or 18pt or larger even if plain, greater than 4.5 otherwise.
 +==== Blues ====
 +
 +=== On Black ===
 +
 +As one recognizes from the really low coefficient blue gets (0.0722), blue is relatively "dark", with just over a tenth the luminance of green. This inspires the question, "can blue be used on a black background? If so, what range of blues can?"
 +
 +If we take [0,0,0] as black, and note that 0/255=0 and 0/12.92=0, we are interested in B satisfying 
 +  * <jsm>\left(0.0722\times B + 0.05\right)/\left(0.05\right)\geq 3.0</jsm>, or 
 +  * <jsm>0.0722\times B \geq 3.0\times 0.05 -0.05 = 2.0\times 0.05 = 0.1 </jsm>
 +  * <jsm>\Rightarrow B\geq \left(0.1\right)/0.0722</jsm> which requires B greater than 1: not possible. Blue needs a little "boosting" with red and green to be bright enough to show well on black. If we use equal amounts of red and green to achieve this, we need
 +  * <jsm>\left(0.0722\times B + 0.9278\times X +0.05\right)/\left(0.05\right) \geq 3.0</jsm>
 +  * <jsm>\left(0.0722\times B + 0.9278\times X \right) \geq 0.15-0.05 \; =\; 0.1 </jsm> which yields, for the brightest blue (1.0)
 +  * <jsm>0.9278 \times X \geq 0.1 - 0.0722 = 0.0278 \Rightarrow X\geq 0.0278/0.9278\approx 0.03</jsm>
 +  * <jsm>\left(\left(X_{sRGB}+0.055\right)/1.055\right)^2.4 \geq 0.03</jsm>
 +  * <jsm> \Rightarrow \left(X_{sRGB}+0.055\right)/1.055 \geq 0.231=\sqrt[2.4]{0.03} </jsm>
 +  * <jsm>X_{sRGB}\geq 0.231\times 1.055 -0.055 = 0.2437 - 0.055 = 0.1887</jsm>
 +  * <jsm>255 \times 0.1887 \approx 48</jsm> to we can use [48,48,255].
 +  * Less blue will require more X, to be determined by analagous calculations. Boosting using only green and no red is left as an exercise.
 +
 +=== On White ===
 +
 +How pale a blue can be used on a white background? White [255,255,255]/255 transforms to [1,1,1], and 
 +  * <jsm>\left(1.055/1.055\right)^{2.4}=1</jsm> 
 +  * (and 0.2126 + 0.7152 + 0.0722= 1.0000) so we are seeking values of B satisfying 
 +  * <jsm>1.05 \geq 3.0\times\left(0.0722\times B +0.05\right)= 0.2166\times B + 0.15 \Rightarrow 0.90\geq 0.2166\times B \Rightarrow 0.90/0.2166 \geq B</jsm> 
 +  * which holds for all values of B from 0 to 1.0.
 +
  
 
contrast.txt · Dernière modification: 2010/01/31 10:16 (modification externe)
 
Sauf mention contraire, le contenu de ce wiki est placé sous la licence suivante :CC Attribution-Noncommercial-Share Alike 3.0 Unported
Recent changes RSS feed Donate Powered by PHP Valid XHTML 1.0 Valid CSS Driven by DokuWiki