0

Wynik kodowania

Kolor HWB

Informacje o kolorze HWB

Kolor HWB to model koloru opisujący barwę trzema składnikami: odcieniem, bielą i czernią. Odcień określa podstawowy ton koloru, a biel i czerń określają, ile bieli i czerni jest domieszane. Dzięki temu łatwo intuicyjnie rozumieć rozjaśnianie, przyciemnianie i przesuwanie koloru w stronę szarości.

SkładnikZnaczeniePrzykładowa wartość
H: OdcieńPrzedstawia ton koloru jako kąt. Czerwony jest około 0deg, zielony około 120deg, a niebieski około 240deg.90deg
W: BielOznacza ilość bieli domieszanej do koloru. Im większa wartość, tym bardziej białawy kolor.20%
B: CzerńOznacza ilość czerni domieszanej do koloru. Im większa wartość, tym ciemniejszy kolor.30%

Na przykład główne kolory, takie jak czerwony, można przedstawić następująco.

KolorNotacja HWBNotacja RGB
Czerwonyhwb(0deg 0% 0%)rgb(255 0 0)
Zielonyhwb(120deg 0% 49.8%)rgb(0 128 0)
Limonkowyhwb(120deg 0% 0%)rgb(0 255 0)
Niebieskihwb(240deg 0% 0%)rgb(0 0 255)
Białyhwb(0deg 100% 0%)rgb(255 255 255)
Czarnyhwb(0deg 0% 100%)rgb(0 0 0)

Aby uwzględnić przezroczystość, dodaj wartość alfa. Na przykład półprzezroczysty czerwony można zapisać jako hwb(0deg 0% 0% / 0.5).

Obsługa odcienia, bieli i czerni

Odcień jest traktowany jako kąt, a wartości większe niż 360deg lub ujemne są normalizowane do zakresu od 0deg do 360deg. Na przykład hwb(360deg 0% 0%) jest traktowane jako ten sam kolor co hwb(0deg 0% 0%), a hwb(-120deg 0% 0%) jako ten sam kolor co hwb(240deg 0% 0%).

Biel i czerń są traktowane w zakresie od 0% do 100%. Większa biel zbliża kolor do białego, a większa czerń do czarnego. Jeśli suma bieli i czerni wynosi 100% lub więcej, kolor jest traktowany jako szarawy niezależnie od odcienia.

Różnica między HWB i HSL

HSL reguluje kolor za pomocą nasycenia i jasności, dlatego nadaje się do określania żywości i jasności. HWB reguluje kolor przez ilość domieszanego białego i czarnego, co ułatwia opis operacji takich jak „uczynić bielszym przy tym samym odcieniu” lub „dodać czerni, aby przyciemnić”.

HWB również nie jest przestrzenią kolorów równomierną percepcyjnie. Gdy chcesz łatwiej obsługiwać postrzeganą jasność lub różnice kolorów, można użyć przestrzeni kolorów takich jak Lab, LCH, Oklab i Oklch.