Utilia

Konwerter kolorów

Konwertuj kolory między HEX, RGB, HSL, HSV, HWB, CMYK, LAB, LCH i OKLCH. Wklej kod, zobacz kolor i skopiuj każdy format jednym kliknięciem.

Przykłady:

Konwersje

CMYK to uproszczona konwersja bez profilu ICC. Do druku poproś drukarnię o konwersję opartą na profilu.

Jak korzystać z konwertera kolorów

  1. Wpisz lub wklej kolor w polu Dane wejściowe. Format jest wykrywany automatycznie: #FF6347, FF6347, rgb(255 99 71), 255, 99, 71, hsl(9 100% 64%), hsv(9, 72%, 100%), cmyk(0, 61, 72, 0), lab(63% 59 48), oklch(70% 0.2 32) albo nazwa, np. tomato.
  2. Konwersje pojawiają się w trakcie pisania. Możesz też nacisnąć Enter lub kliknąć Konwertuj.
  3. Sprawdź próbkę: pokazuje kolor i Wykryty format, dzięki czemu wiesz, jak odczytano twoje dane.
  4. Kliknij Kopiuj obok potrzebnego formatu. Przyciski z przykładami pozwalają wypróbować typowe wartości.

Konwersja odbywa się w całości w twojej przeglądarce.

Obsługiwane formaty

Format Przykład Typowe zastosowanie
HEX #FF6347 HTML, CSS, narzędzia projektowe
RGB rgb(255, 99, 71) CSS, kod, edytory grafiki
HSL hsl(9, 100%, 64%) CSS, regulacja jasności
HSV / HSB hsv(9, 72%, 100%) Photoshop, Figma, próbniki kolorów
HWB hwb(9 28% 0%) CSS Color 4
CMYK cmyk(0%, 61%, 72%, 0%) druk (zob. uwagę poniżej)
LAB (D50) lab(62.99% 59.36 47.88) CSS lab(), nauka o barwie
LCH lch(62.99% 76.27 38.89) CSS lch()
OKLCH oklch(69.62% 0.1955 32.32) nowoczesny CSS, systemy projektowe

Wyniki HEX, RGB, HSL, HWB, LAB, LCH i OKLCH to poprawny CSS, który możesz wkleić prosto do arkusza stylów. HSV i CMYK nie są notacjami CSS, dlatego zapisuje się je w umownym stylu funkcji, wyłącznie do odczytu. W kodzie CSS liczby zawsze mają kropkę dziesiętną, a nie przecinek.

Jeśli twój kolor ma przezroczystość (np. rgb(255 0 0 / 50%)), konwerter ją zachowuje: HEX staje się kodem ośmiocyfrowym, np. #FF000080, a pozostałe formaty otrzymują wartość alfa.

Jak działają konwersje

RGB, HEX, HSL, HSV i HWB to różne zapisy tych samych wartości sRGB, więc konwertują się dokładnie (z dokładnością do zaokrągleń). LAB i LCH są zgodne z definicją CSS Color 4, która używa punktu bieli D50 z adaptacją chromatyczną Bradforda. Niektóre konwertery online używają zamiast tego D65, więc ich wartości LAB dla tego samego koloru mogą się różnić o kilka jednostek. OKLCH korzysta z modelu Oklab Björna Ottossona – tego samego, którego przeglądarki używają dla oklch().

Gdy wpiszesz kolor LAB, LCH lub OKLCH zbyt nasycony dla zwykłego ekranu, leży on poza gamutem sRGB i nie ma odpowiednika HEX. Narzędzie wyświetla wtedy komunikat i zastępuje go najbliższym możliwym do wyświetlenia kolorem, zmniejszając nasycenie (chromę) przy zachowaniu jasności i odcienia.

CMYK to przybliżenie

Wartości CMYK są liczone uproszczonym wzorem K = 1 − max(R, G, B) i C = (1 − R − K) / (1 − K), analogicznie dla M i Y. Nie bierze w tym udziału żaden profil ICC, więc liczby nie przewidują, co wydrukuje konkretna maszyna. Przy profesjonalnym druku wykonaj konwersję w programie do składu z profilem dostarczonym przez drukarnię (np. FOGRA39 lub GRACoL). Konwersja CMYK z powrotem na RGB używa wzoru odwrotnego R = (1 − C)(1 − K).

Najczęściej zadawane pytania

Jak ręcznie przeliczyć HEX na RGB?

Podziel kod na trzy pary i przelicz każdą z systemu szesnastkowego na dziesiętny. Dla #FF6347: FF = 255, 63 = 99, 47 = 71, więc kolor to rgb(255, 99, 71).

Czym różni się HSL od HSV?

Oba modele używają kąta odcienia i nasycenia, ale trzecia wartość w HSL to jasność (50% to czysty kolor, 100% to biel), a w HSV to wartość, czyli jasność w innym sensie (100% to czysty kolor lub biel, zależnie od nasycenia). Ten sam kolor ma więc w każdym modelu inne wartości nasycenia.

Dlaczego moja wartość LAB różni się od wyniku innego konwertera?

Najpewniej z powodu punktu bieli. To narzędzie używa D50, tak jak CSS lab(). Konwertery oparte na D65 dają nieco inne liczby. Oba wyniki są poprawne w swoim układzie odniesienia.

Czy mogę przeliczyć CMYK na HEX?

Tak. Wpisz np. cmyk(0%, 61%, 72%, 0%) lub cmyk(0, 0.61, 0.72, 0). Pamiętaj, że wynik jest przybliżeniem bez profilu kolorów.

Czy narzędzie przyjmuje kolory bez znaku #?

Tak. Rozpoznawane są ff6347, f64, a nawet trzy liczby oddzielone przecinkami, np. 255, 99, 71.