Gute Text Vordergrundfarbe für einen bestimmten Hintergrundfarbe

Question

Ich zeichne eine Farbauswahltaste, und ich bin auf der Suche nach einer schönen und einfachen Formel eine gute Textfarbe (Vordergrund) für eine bestimmte Hintergrundfarbe in RGB zu erhalten.

Ein einfacher Versuch wäre, nur die Ergänzung Farbe zu nehmen, aber das wird eine seltsam aussehende Taste für Farben wie reines Blau oder reines Rot produzieren.
Gibt es etwas gut bekannt, dass dies tut?

Wenn es überhaupt ankommt, ich bin mit QT.

Answer 1

Für eine maximale Lesbarkeit, möchten Sie die maximale Helligkeit Kontrast ohne in Farben zu bekommen, die nicht zusammenarbeiten. Die konsequenteste Weg, dies zu tun, ist mit schwarz-Stick oder weiß für den Textfarbe. Sie könnten in der Lage sein, mit mehr ästhetisch ansprechenden Systemen zu kommen, aber keiner von ihnen wird mehr lesbar ist.

zwischen schwarz oder weiß wählen, müssen Sie die Helligkeit des Hintergrunds kennen. Dies wird ein wenig komplizierter, aufgrund von zwei Faktoren ab:

• Die empfundene Helligkeit der einzelnen Primärfarben Rot, Grün und Blau sind nicht identisch. Der schnellste Rat, den ich geben kann, ist die traditionelle Formel verwenden RGB zu umwandeln grau - R * 0.299 + G * 0.587 + B * 0,114. Es gibt viele andere Formeln.

• Die Gamma-Kurve zeigt angelegt macht den mittleren Grauwert höher ist als man erwarten würde. Dies ist leicht gelöst, indem 186 als mittlerer Wert mit eher als 128. Alles, was weniger als 186 weißen Text verwendet werden soll, etwas größer als 186 schwarzen Text verwenden soll.

Answer 2

Ich bin kein Experte auf Programmierung Dingen RGB verwendet, aber aus Sicht der Designer, oft die lesbare Farbe wird nur viel leichter (wenn die Hintergrundfarbe ist dunkel) oder dunkler (wenn die Hintergrundfarbe ist hell) Version des gleichen Farbton.

Im Wesentlichen würden Sie Ihre RGB-Werte nehmen und wenn sie sind näher an 0 (dunkel) würden Sie schieben Sie sie um einen gleichen Betrag für Ihre Vordergrundfarbe jeder, oder umgekehrt, wenn es ein Licht BG.

Complement Farben können tatsächlich auf den Augen, um die Lesbarkeit wirklich schmerzhaft sein.

Answer 3

Nutzen Sie eine Übersicht für die Lesbarkeit

Wenn von „gute Textfarbe (Vordergrund)“ Sie beabsichtigen, es für Lesbarkeit Zwecke, wenn der Benutzer any background colour wählt, können Sie immer produzieren weißen Text einen schwarzen Umriss. Es wird auf jedem festen, gemustert oder Gradienten Hintergrund, von schwarz bis weiß und alles dazwischen lesbar sein.

Auch wenn dies nicht die Marke von Ihrer Absicht nicht getroffen, ich denke, es lohnt sich hier gepostet, weil ich auf der Suche nach ähnlichen Lösungen kam.

Answer 4

Aufbauend auf dem Gipfel von Mark Antwort, hier einig Ruby-Code, die die Arbeit tun,

rgbval = "8A23C0".hex
r = rgbval >> 16
g = (rgbval & 65280) >> 8
b = rgbval & 255
brightness = r*0.299 + g*0.587 + b*0.114
return (brightness > 160) ? "#000" : "#fff"

Answer 5

Sie sind besser mit einem hohen Unterschied in der Helligkeit ab. Im Allgemeinen farbige Hintergründe mit farbigem Text zur besseren Lesbarkeit saugen, die Augen im Laufe der Zeit zu verletzen. Leicht getönte Farben (z.B. in HSB, S ~ 10%, B> 90%) mit feinem schwarzem Text Arbeit oder leicht getönten einem schwarzen Hintergrund Text über. Ich würde bleiben weg sowohl von Färbung. Dunkler Text (b ~ 30%, s> 50%) mit einer subtilen Farbgebung über einen weißen Hintergrund kann auch in Ordnung sein. Yellow (gelb) Text auf einem tiefblauen Hintergrund hat eine ausgezeichnete Lesbarkeit, wie gelb oder grün auf schwarz tut. Aus diesem Grunde alt dumbterms (VT100, VT52, etc.) für diese Farben ging.

Wenn Sie wirklich tun müssen, Color-on-Farbe für den ‚Look‘, könnten Sie beide H und B umgekehrt, während der Sättigung bei einem mittleren bis niedrigem Niveau feststecken.

Und noch eine letzte Anmerkung: Wenn Sie einen 50% grauen Hintergrund haben, überdenken Sie Ihre Schnittstelle. Sie berauben sich selbst von einem halben dynamischen Bereich! Sie sind Low-Sichtbarkeit Benutzer zu entfremden, darunter alle Personen über 35 ...

Answer 6

Farbkombinationen sehen oft schrecklich, wenn nicht sorgfältig ausgewählt. Warum nicht entweder weiß oder schwarz für den Text, in Abhängigkeit von der Helligkeit der Farbe. (Müssen zuerst HSB konvertieren.)

oder lassen Sie den Benutzer entweder schwarz oder weiß Text wählen.

oder verwenden vordefinierte Kombinationen. Dies ist, was Google tut in ihrem Kalender Produkt.

Answer 7

Ich habe für eine simailr Antwort gesucht und kam in diesem Post und einige andere, die ich dachte, ich würde Aktie. Nach http://juicystudio.com/services/luminositycontrastratio.php#specify die " Erfolgskriterium 1.4.3 von WCAG 2.0 erfordert die visuelle Darstellung von Text und Bildern von Text hat ein Kontrastverhältnis von mindestens 4,5: 1" mit einigen Ausnahmen. Diese Stelle kann Sie im Vordergrund und Hintergrundfarben setzen ihren Kontrast zu berechnen, obwohl es wäre hilfreich, wenn es Alternativen oder Bereiche vorschlagen würde.

Eine der besten Seiten, die ich für die Visualisierung Farbkontrast gefunden haben, ist http://colorizer.org/ Es können Sie fast alle Arten von Farbskalen (RGB, CMYK usw.) zur gleichen Zeit einstellen und zeigen Ihnen dann das Ergebnis auf dem Bildschirm, wie weißer Text auf einem gelben Hintergrund.

Answer 8

ich in der Regel bei Farb Ergänzungen aussehen, sondern auch Farbe Ergänzung Räder helfen

http://www.makart.com/resources/artclass/cwheel.html

Wenn Sie die Farbe HSL ist, drehen Sie den Farbton um 180 Grad für eine anständige Berechnung

Answer 9

ich, was in dem HSV Umwandlung könnte der Weg sein, aber IMO Farbton ändert aussehen würde seltsam. Ich würde versuchen, den Farbton und das Hantieren mit dem Wert zu halten und vielleicht Sättigung (hellrot Tasten mit dunkelrotem Text ... hm klingt unheimlich :-)).