Konwersja kodów kolorów

Konwersja kodów kolorów (konwerter kolorów)

Po określeniu koloru za pomocą selektora kolorów lub wartości liczbowej system automatycznie oblicza wartości HEX, RGB, HSL, HSV i CMYK. Każdy format można skopiować jednym kliknięciem oraz sprawdzić współczynnik kontrastu w połączeniu z kolorami dopełniającymi i kolorami tekstu.

Wprowadź kolor

Obsługuje formaty #RGB, #RGBA, #RRGGBB oraz #RRGGBBAA.

%
%

%
%

%
%
%
%

Wynik tłumaczenia

Wprowadzone kolory zostały przekonwertowane na poszczególne formaty kolorów.

Tekst przykładowy
HEX
HEXA (z kryciem)
RGB
RGBA
HSL
HSLA
HSV / HSB
CMYK

Kolory dopełniające

Jest to kolor przeciwny, przesunięty o 180 stopni na kole kolorów.

Kontrast z kolorem tekstu

Stosunek do białego tekstu
Stosunek do czarnego tekstu
Kolor tekstu zapewniający dobrą czytelność:

Wszystkie konwersje kolorów odbywają się w przeglądarce; dane wejściowe nie są wysyłane na serwer.

Czym jest narzędzie do konwersji kodów kolorów?

Color Code Converter to bezpłatne narzędzie online, które konwertuje numeryczne reprezentacje kolorów stosowane w projektowaniu stron internetowych, tworzeniu aplikacji, edycji obrazów i projektowaniu materiałów drukowanych. Nawet w przypadku tego samego koloru format używany do jego określenia — taki jak HEX, RGB, HSL, HSV lub CMYK — różni się w zależności od aplikacji lub oprogramowania. Dzięki temu narzędziu wystarczy wpisać jeden kolor, aby na pierwszy rzut oka zobaczyć wartości we wszystkich głównych formatach.

HEX to notacja szesnastkowa szeroko stosowana w arkuszu stylów CSS stron internetowych. Na przykład biel jest reprezentowana jako #FFFFFF, a czerń jako #000000. RGB to system łączący światło czerwone, zielone i niebieskie w skali od 0 do 255, wykorzystywany do obsługi kolorów na wyświetlaczach. RGBA i 8-cyfrowy HEXA pozwalają również określić stopień przezroczystości, dzięki czemu są przydatne do tworzenia półprzezroczystych kolorów tła i nakładek.

HSL opisuje kolor za pomocą odcienia, nasycenia i jasności. Odcień określa się na kole kolorów w zakresie od 0 do 360 stopni, natomiast nasycenie i jasność określa się w skali od 0 do 100%.Ten format ułatwia intuicyjne dostosowywanie kolorów, na przykład poprzez ich nieznaczne rozjaśnienie lub stonowanie intensywności. Systemy HSV lub HSB opisują kolor za pomocą odcienia, nasycenia i jasności i są stosowane w wielu programach graficznych oraz narzędziach do wybierania kolorów.

CMYK to model kolorów oparty na proporcjach atramentów cyjanowego, magentowego, żółtego i czarnego, stosowany głównie w branży poligraficznej. Jednak wartości CMYK obliczone matematycznie na podstawie kolorów RGB wyświetlanych na ekranie stanowią jedynie orientacyjne wskazówki. Ponieważ rzeczywiste wyniki druku zależą od takich czynników, jak rodzaj papieru, atrament, maszyna drukarska oraz profile ICC, w przypadku materiałów drukowanych wymagających dokładności odwzorowania kolorów należy skonsultować się z drukarnią i zweryfikować środowisko zarządzania kolorami.

Narzędzie to wyświetla nie tylko wartości dla każdego formatu, ale także podgląd wybranego koloru, jego koloru dopełniającego (przesuniętego o 180 stopni w odcieniu) oraz współczynnik kontrastu przy nałożeniu białego i czarnego tekstu. Jest to przydatne przy wyborze kolorów tekstu, które są czytelne na tle danego koloru, oraz przy rozważaniu schematów kolorystycznych z uwzględnieniem dostępności.Wszystkie obliczenia są wykonywane w przeglądarce, a wprowadzone informacje o kolorach nigdy nie są wysyłane na serwer.

Sposób użycia

  1. Użyj selektora kolorów lub wprowadź wartość w formacie HEX, RGB, HSL, HSV lub CMYK.
  2. W zależności od wprowadzonego formatu wartości w innych formatach kolorów zostaną zaktualizowane automatycznie.
  3. Jeśli wymagana jest przezroczystość, dostosuj suwak przezroczystości lub pole liczbowe.
  4. Po kliknięciu przycisku „Wyświetl wyniki konwersji” nastąpi przekierowanie do sekcji wyników, w której można sprawdzić poszczególne formaty, kolory uzupełniające oraz współczynnik kontrastu.
  5. Kliknij „Kopiuj” w wybranym formacie, a następnie wklej tekst do pliku CSS, narzędzi projektowych, dokumentacji itp.

Środki ostrożności dotyczące użytkowania

  • Wartości CMYK są ogólnymi przeliczeniami opartymi na wartościach RGB i nie gwarantują dokładnego odwzorowania kolorów w druku.
  • Przezroczystość jest odzwierciedlona w wartościach RGB, HSL i HEXA, ale model CMYK nie uwzględnia pojęcia przezroczystości.
  • W zależności od ustawień wyświetlacza, przeglądarki i systemu operacyjnego ten sam kod koloru może wyglądać inaczej.
  • Współczynnik kontrastu jest obliczany na podstawie kolorów nieprzezroczystych, z wyłączeniem przezroczystości. Czytelność może się różnić w zależności od rzeczywistego obrazu tła oraz sposobu nakładania się elementów.
  • Bardzo małe liczby dziesiętne będą zaokrąglane do odpowiedniej liczby miejsc po przecinku w celu zapewnienia czytelności.

Najczęściej zadawane pytania

Kolory są przedstawiane w notacji szesnastkowej. Zazwyczaj stosuje się 6-cyfrowy format #RRGGBB; w przypadku uwzględnienia przezroczystości stosuje się 8-cyfrowy format #RRGGBBAA.

RGB składa się z trzech składowych — czerwonej, zielonej i niebieskiej — natomiast RGBA dodaje kanał alfa, który służy do przedstawiania przezroczystości.

Jest to przydatne, gdy chcesz dostosować jasność lub nasycenie, zachowując ten sam odcień. Doskonale nadaje się również do tworzenia wariantów kolorystycznych w CSS.

Zasadniczo odnoszą się one do tego samego modelu. Litera „V” oznacza „Value” (wartość), a litera „B” oznacza „Brightness” (jasność), choć terminologia ta może się różnić w zależności od aplikacji.

Wyświetla przybliżone wartości obliczone na podstawie ogólnych wzorów. Aby uzyskać dokładne odwzorowanie kolorów na wydruku, wymagane są profile ICC oraz odpowiednie środowisko drukowania.

Tak. Jeśli wprowadzisz wartość w formacie #RGB, zostanie ona przekonwertowana na format #RRGGBB, przy czym każda cyfra zostanie powtórzona dwukrotnie.

Tak. Obsługuje zarówno format #RGBA, jak i #RRGGBBAA przy wprowadzaniu i wyświetlaniu danych.

Są to kolory znajdujące się po przeciwnej stronie koła kolorów. Narzędzie to oblicza je poprzez przesunięcie odcienia HSL o 180 stopni.

Wartość ta określa różnicę w jasności między kolorem tła a kolorem tekstu. Ogólnie rzecz biorąc, im wyższa liczba, tym łatwiej jest odróżnić tekst.

Porównaj współczynniki kontrastu w sekcji wyników; wybór tego o wyższym współczynniku poprawi czytelność.

Nie. Konwersja i wyświetlanie odbywają się całkowicie w przeglądarce; wartości kolorów nie są wysyłane do serwera w celu przetworzenia.

Tak. W obsługiwanych przeglądarkach można konwertować wartości za pomocą selektora kolorów lub pól wprowadzania wartości liczbowych.