Dobry kolor tekstu dla danego koloru tła

Nie jestem ekspertem w programowaniu rzeczy związanych z RGB, ale z perspektywy projektanta, często najbardziej czytelny kolor będzie po prostu znacznie jaśniejszą (jeśli kolor tła jest ciemny) lub ciemniejszą (jeśli kolor tła jest jasny) wersją tego samego odcienia.

Zasadniczo weźmiesz swoje wartości RGB i jeśli są bliżej 0 (ciemne), popchniesz je każdy w górę o taką samą wartość dla koloru pierwszego planu, lub odwrotnie, jeśli jest to jasny BG.

Kolory dopełniacza mogą być naprawdę bolesne w oczach dla czytelności.

Wykorzystaj zarys czytelności

Jeśli przez "dobry kolor tekstu (pierwszy plan)" zamierzamy go dla czytelności, gdy użytkownik wybierze any background colour, zawsze możemy wytworzyć biały tekst z czarnym konturem. Będzie czytelny na dowolnym stałym, wzorzystym lub gradientowym tle, od Czarnego do białego i wszystkiego pomiędzy.

Nawet jeśli nie trafi to w twoje intencje, myślę, że warto tu zamieścić, ponieważ przyszedłem szukając podobnych rozwiązań.

Bazując na odpowiedzi Marka, oto kod Ruby, który wykona pracę

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"

Lepiej Ci z dużą różnicą jasności. Ogólnie rzecz biorąc, kolorowe tła z kolorowym tekstem ssać dla czytelności, raniąc oczy w czasie. Kolory lekko przyciemnione (np. w HSB, S~10%, B>90%) z czarnym tekstem działają dobrze, lub lekko przyciemniony tekst na czarnym tle. Trzymałbym się z dala od kolorowania obu. Ciemny tekst (b~30%, s>50%) z subtelnym zabarwieniem na białym tle może być również w porządku. Żółty (bursztynowy) tekst na ciemnoniebieskim tle ma doskonałą czytelność, podobnie jak bursztynowy lub zielony na czarnym. Dlatego stare dumbtermy (vt100, vt52 itp.) sięgnął po te kolory.

Jeśli naprawdę potrzebujesz zrobić kolor na kolor dla "wyglądu", możesz odwrócić zarówno H, jak i B, jednocześnie przypinając nasycenie na umiarkowanym lub niskim poziomie.

I ostatnia uwaga: jeśli masz 50% szare tło, przemyśl swój interfejs. Okradasz się z połowy zakresu dynamicznego! Zrażasz użytkowników o słabej widoczności, w tym wszystkich Powyżej 35 roku życia...

Kombinacje kolorów często wyglądają okropnie, gdy nie są starannie dobrane. Dlaczego nie użyć białego lub czarnego tekstu, w zależności od jasności koloru. (Najpierw trzeba będzie przekonwertować na HSB.)

Lub pozwól użytkownikowi wybrać czarny lub biały tekst.

Lub użyć predefiniowanych kombinacji. To właśnie robi Google w swoim produkcie kalendarza.

Szukałem odpowiedzi simailr i natknąłem się na ten post i kilka innych, które myślałem, że podzielę. Zgodnie z http://juicystudio.com/services/luminositycontrastratio.php#specify "kryterium sukcesu 1.4.3 WCAG 2.0 wymaga wizualnej prezentacji tekstu, a obrazy tekstu mają współczynnik kontrastu co najmniej 4,5:1" z pewnymi wyjątkami. Ta strona pozwala umieścić na pierwszym planie i kolorach tła, aby obliczyć ich kontrast, chociaż byłoby pomocne, gdyby to zaproponuj alternatywy lub zakresy.

Jedną z najlepszych stron, jakie znalazłem do wizualizacji kontrastu kolorów jest http://colorizer.org/ pozwala dostosować prawie wszystkie skale kolorów (RGB, CMYK, itp.) w tym samym czasie, a następnie pokazuje wynik na ekranie, na przykład biały tekst na żółtym tle.

Zazwyczaj patrzę na dopełnienia kolorów, mają również koła dopełnienia kolorów, które pomagają

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

Jeśli twoim kolorem jest HSL, Odwróć odcień o 180 stopni, aby uzyskać przyzwoite obliczenia

Wydaje mi się, że konwersja na HSV może być drogą, ale IMO zmiana barwy wyglądałaby dziwnie. Spróbowałbym zachować odcień i majstrować przy wartości i może nasyceniu (jasnoczerwone przyciski z ciemnoczerwonym tekstem ... hm brzmi strasznie: -)).