Beste Möglichkeit, eine Farbe auszuwählen, um Text über einem Vollfarbhintergrund anzuzeigen

Ich versuche, eine einfache Farbauswahl-GUI mit einem Feld auf der rechten Seite zu erstellen, das die ausgewählte Farbe anzeigt. Mir ist jedoch aufgefallen, dass Schwarz möglicherweise nicht die beste Farbe ist, da es bei einem schwarzen Hintergrund unsichtbar wäre.

Also habe ich beschlossen, die Farbe zu invertieren und anzuzeigen, und es funktioniert etwas besser, ist aber manchmal immer noch nicht so lesbar, wie ich es gerne hätte.

Gibt es eine Konvention, um eine Farbe für Text über einer Farbe zu wählen, oder ist dies bereits die akzeptierte Methode?

TIA

Beispiele für meine alte Methode (erste ist besser lesbar):
Nicht allzu lesbarer Text auf rosa HintergrundGeben Sie hier die Bildbeschreibung ein


Bearbeiten: Diese Frage ähnelt möglicherweise dem vorgeschlagenen Duplikat, aber die Antworten sind es definitiv nicht (und sie beantworten meine Frage nicht). Eine Antwort auf die andere Frage schlägt lediglich vor, je nach Farbe einen helleren/dunkleren Farbton zu verwenden (und sagt dann weiter, dass Voreinstellungen möglicherweise sinnvoller sind), und die andere gibt eine Antwort, die von der ursprünglichen Farbe des Fragestellers abhängt ("looks wie deine BG-Farbe etwa #aa0000 ist"). Die beiden Antworten auf diese Frage beheben jedoch mein ursprüngliches Problem - wie man eine Farbe dynamisch basierend auf dem Hintergrund bestimmt.

Der Text in beiden Beispielen sollte weiß sein
@DaveHaigh du hast recht - aber wie soll das bestimmt werden? Was würde ich auf einem Hintergrund tun, der weiß oder fast weiß (grau usw.) ist?
Verwenden Sie im Allgemeinen kontrastierende Farben (z. B. weißer Text auf dunklem Hintergrund, schwarzer Text auf hellem Hintergrund). Sie werden keine Farbe finden, die universell funktioniert.
@blu Sie haben Recht mit dem verknüpften Duplikat, die Antworten dort helfen Ihnen nicht sehr und scheinen hier bereits anständige Antworten zu haben. Ich stimme dafür, dies offen zu lassen.

Antworten (2)

Sie können einen Online-Farbkontrastprüfer verwenden, um zwei Farben auf ihr Kontrastverhältnis und ihren Helligkeitsunterschied zu vergleichen.

Ein Beispiel ist snook Color Contrast Check http://snook.ca/technical/colour_contrast/colour.html

Auf diese Weise erhalten Sie auch Daten darüber, ob der Kontrast hoch genug ist, um den Standards für die Barrierefreiheit im Internet zu entsprechen.

Wenn Sie eine feste Hintergrundfarbe haben, zB #FF0000. Sie könnten dies mit Weiß und dann mit Schwarz vergleichen, dann die Ergebnisse vergleichen und die kontrastreichste Kombination auswählen.

Sie können die Textfarbe je nach Helligkeit Ihrer Hintergrundfarbe entweder auf Schwarz oder Weiß einstellen.

Wenn die Hintergrundfarbe heller als ein bestimmter Schwellenwert ist, wird die Textfarbe auf Schwarz gesetzt.

Wenn die Helligkeit geringer ist, können Sie den Text auf Weiß setzen.

Dieser Artikel Die empfundene Helligkeit einer Farbe berechnen erklärt, wie man es umsetzt.