Formel zur Bestimmung der wahrgenommenen Helligkeit der RGB-Farbe

Question

Ich suche nach einer Art Formel oder Algorithmus, um die Helligkeit einer Farbe anhand der RGB-Werte zu bestimmen. Ich weiß, dass es nicht so einfach ist, die RGB-Werte zusammenzuzählen und höhere Summen heller zu machen, aber ich bin irgendwie ratlos, wo ich anfangen soll.

Answer 1

Statt in der zufälligen Auswahl der hier erwähnten Formeln verloren zu gehen, empfehle ich Ihnen, die von den W3C-Standards empfohlene Formel zu verwenden.

Hier ist eine einfache, aber genaue PHP-Implementierung der WCAG 2.0 SC 1.4.3 relativen Helligkeit und Kontrastverhältnis Formeln. Es liefert Werte, die zur Bewertung der für die WCAG-Konformität erforderlichen Verhältnisse geeignet sind, wie auf dieser Seite, und ist daher für jede Web-App geeignet und angemessen. Dies ist trivial in andere Sprachen zu portieren.

/**
 * Berechnen Sie die relative Helligkeit im sRGB-Farbraum zur Verwendung in der WCAG 2.0-Konformität
 * @link http://www.w3.org/TR/WCAG20/#relativeluminancedef
 * @param string $col Eine 3- oder 6-stellige hexadezimale Farbzeichenfolge
 * @return float
 * @author Marcus Bointon 
 */
function relativeluminance($col) {
    //Entfernen Sie das führende #
    $col = trim($col, '#');
    //Konvertieren Sie 3-stellig in 6-stellig
    if (strlen($col) == 3) {
        $col = $col[0] . $col[0] . $col[1] . $col[1] . $col[2] . $col[2];
    }
    //Hexadezimal in den 0-1-Bereich umrechnen
    $components = array(
        'r' => hexdec(substr($col, 0, 2)) / 255,
        'g' => hexdec(substr($col, 2, 2)) / 255,
        'b' => hexdec(substr($col, 4, 2)) / 255
    );
    //Korrektur für sRGB
    foreach($components as $c => $v) {
        if ($v <= 0.04045) {
            $components[$c] = $v / 12.92;
        } else {
            $components[$c] = pow((($v + 0.055) / 1.055), 2.4);
        }
    }
    //Relative Helligkeit mit ITU-R-BT. 709-Koeffizienten berechnen
    return ($components['r'] * 0.2126) + ($components['g'] * 0.7152) + ($components['b'] * 0.0722);
}

/**
 * Kontrastverhältnis gemäß WCAG 2.0-Formel berechnen
 * Gibt einen Wert zwischen 1 (kein Kontrast) und 21 (maximaler Kontrast) zurück
 * @link http://www.w3.org/TR/WCAG20/#contrast-ratiodef
 * @param string $c1 Eine 3- oder 6-stellige hexadezimale Farbzeichenfolge
 * @param string $c2 Eine 3- oder 6-stellige hexadezimale Farbzeichenfolge
 * @return float
 * @author Marcus Bointon 
 */
function contrastratio($c1, $c2) {
    $y1 = relativeluminance($c1);
    $y2 = relativeluminance($c2);
    //Anordnen, sodass $y1 am hellsten ist
    if ($y1 < $y2) {
        $y3 = $y1;
        $y1 = $y2;
        $y2 = $y3;
    }
    return ($y1 + 0.05) / ($y2 + 0.05);
}

Answer 2

Um das hinzuzufügen, was alle anderen gesagt haben:

All diese Gleichungen funktionieren in der Praxis ganz gut, aber wenn Sie sehr präzise sein müssen, müssen Sie die Farbe zunächst in den linearen Farbraum konvertieren (umgekehrte Bildgamma anwenden), den gewichteten Durchschnitt der Primärfarben berechnen und - falls Sie die Farbe anzeigen möchten - die Helligkeit wieder in den Monitor-Gamma überführen.

Der Helligkeitsunterschied zwischen der Vernachlässigung von Gamma und der korrekten Gammanutzung beträgt bis zu 20 % bei dunklem Grau.

Answer 3

Betrachten Sie dies als Ergänzung zu Myndex's ausgezeichnete Antwort. Wie er (und andere) erklären, sind die Algorithmen zur Berechnung der relativen Helligkeit (und der wahrgenommenen Helligkeit) einer RGB-Farbe darauf ausgelegt, mit linearen RGB-Werten zu arbeiten. Sie können sie nicht einfach auf rohe sRGB-Werte anwenden und hoffen, die gleichen Ergebnisse zu erhalten.

Nun, das klingt alles in der Theorie großartig, aber ich brauchte wirklich, um die Beweise selbst zu sehen, also, inspiriert von Petr Hurtaks Farbverläufen, machte ich meine eigenen. Sie zeigen die beiden häufigsten Algorithmen (ITU-R Empfehlung BT.601 und BT.709) und zeigen deutlich, warum Sie Ihre Berechnungen mit linearen Werten (nicht gamma-korrigierten) durchführen sollten.

Zunächst hier sind die Ergebnisse des älteren ITU BT.601 Algorithmus. Der auf der linken Seite verwendet rohe sRGB-Werte. Der auf der rechten Seite verwendet lineare Werte.

ITU-R BT.601 Farbhelligkeitsverläufe

0,299 R + 0,587 G + 0,114 B

Bei dieser Auflösung können Sie sehen, dass viele benachbarte Pixel auf der linken Seite nicht einmal annähernd die gleiche Helligkeit haben - im oberen Teil gibt es helle rote Pixel neben sehr dunklen. Bei höherer Auflösung beginnen unerwünschte Muster aufzutreten:

Der lineare hat damit nicht zu kämpfen, aber es gibt ziemlich viel Rauschen dort. Vergleichen wir es mit der ITU-R Empfehlung BT.709…

ITU-R BT.709 Farbhelligkeitsverläufe

0,2126 R + 0,7152 G + 0,0722 B

Oh Junge. Offensichtlich nicht dafür gedacht, mit rohen sRGB-Werten verwendet zu werden! Und doch machen das genau die meisten Leute!

Bei hoher Auflösung können Sie wirklich sehen, wie effektiv dieser Algorithmus ist, wenn man lineare Werte verwendet. Er hat bei weitem nicht so viel Rauschen wie der frühere. Obwohl keiner dieser Algorithmen perfekt ist, ist dieser so gut wie es nur geht.

Answer 4

Ich habe diesen Code (geschrieben in C#) gefunden, der hervorragend die "Helligkeit" einer Farbe berechnet. In diesem Szenario versucht der Code zu bestimmen, ob weißer oder schwarzer Text über der Farbe platziert werden soll.

Answer 5

Interessanterweise verwendet diese Formulierung für RGB => HSV einfach v=MAX3(r,g,b). Mit anderen Worten, du kannst das Maximum von (r,g,b) als V in HSV verwenden.

Ich habe überprüft und auf Seite 575 von Hearn & Baker berechnen sie "Value" auch auf diese Weise.