I'm looking for some kind of formula or algorithm to determine the brightness of a color given the RGB values. I know it can't be as simple as adding the RGB values together and having higher sums be brighter, but I'm kind of at a loss as to where to start.
You can calculate subjective brightness of an RGB value by weighting the three channels according to their perceived brightness, e.g. with something like: (0.21 × R) + (0.72 × G) + (0.07 × B) So, for instance, that makes yellow ( #ffff00 ) twice as intense as red ( #ff0000 ).
The function R*0.2126+ G*0.7152+ B*0.0722 is said to calculate the perceived brightness (or equivalent grayscale color) for a given an RGB color. Assuming we use the interval [0,1] for all RGB values, we can calculate the following: yellow = RGB(1,1,0) => brightness=0.9278.
The method could vary depending on your needs. Here are 3 ways to calculate Luminance:
Luminance (standard for certain colour spaces): (0.2126*R + 0.7152*G + 0.0722*B)
source
Luminance (perceived option 1): (0.299*R + 0.587*G + 0.114*B)
source
Luminance (perceived option 2, slower to calculate): → sqrt( 0.241*R^2 + 0.691*G^2 + 0.068*B^2 )
sqrt( 0.299*R^2 + 0.587*G^2 + 0.114*B^2 )
(thanks to @MatthewHerbst) source
[Edit: added examples using named css colors sorted with each method.]
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With