Przejdź do treści

Konwerter kolorów

Konwertuj lokalnie jeden kolor między 6-cyfrowym HEX (#RRGGBB), RGB, HSL i CMYK za pomocą próbnika koloru, koloru losowego, podglądu na żywo, sterowania kanałami, gotowych do kopiowania wartości CSS HEX/RGB/HSL oraz referencyjnego zapisu CMYK.

HEX

#

RGB

HSL

CMYK

Konwerter kolorów

Szybki start

1
Wprowadź 6-cyfrowy HEX lub kanały RGB/HSL/CMYK
2
Użyj próbnika albo koloru losowego i sprawdź zsynchronizowane wartości

Typowe scenariusze

Przekazanie z designu

konwertuj HEX z plików projektowych na CSS RGB/HSL na potrzeby frontendu.

Księga stylów

ujednolić formaty kolorów i styl zapisu w bibliotece komponentów.

Drukuj referencje

przekonwertuj kolor ekranu na CMYK jako pierwsze oszacowanie, a następnie potwierdź za pomocą korekty i przepływu pracy drukowania

Dostępność

użyj podglądu tylko do szybkiej kontroli wizualnej; użyj dedykowanego narzędzia kontrastu, aby uzyskać dokładne proporcje

Parametry konwersji i wyświetlania

Reguły wprowadzania: HEX obsługuje tylko 6 cyfr (#RRGGBB, bez #RGB, #RGBA, #RRGGBBAA lub alfa); RGB 0–255; H 0–360; S/L 0–100; CMYK 0–100. Przy wprowadzaniu wielkość liter nie jest uwzględniana
Zachowanie podglądu: na komputerze podgląd na żywo po prawej; na urządzeniach mobilnych tryb uproszczony bez podglądu.
Próbnik koloru: użyj próbnika na karcie HEX.
Strategia wielkości liter HEX: wyjściowo wszystkie litery są wielkie (np. #1E90FF); wejście jest nieczułe na wielkość; brak osobnego przełącznika.
Precyzyjna regulacja: przeciągaj litery kanałów w lewo/prawo (Shift ×10, Alt ÷0.1).
Kopiowanie wyniku: przycisk zwraca ustandaryzowane wartości CSS HEX, RGB i HSL (HEX wielkimi literami) albo referencyjny zapis CMYK cmyk(...)

Wskazówki użycia

Precyzja: zarządzanie kolorem przez urządzenia/ekrany różni się; wartości z pipet mogą się nieznacznie różnić między aplikacjami.
Kanał alpha: bieżące formaty nie obejmują alpha; użyj rgba()/hsla() lub osobnego parametru.
Przestrzeń barw: domyślnie web używa sRGB; w workflow P3/Display‑P3 konieczna dodatkowa weryfikacja.
Spójność zespołu: uzgodnijcie kanoniczny format w CSS (np. wszędzie HSL).

Ograniczenia i kompatybilność

Różnice urządzeń: monitory/przeglądarki/systemy różnie zarządzają kolorem, więc efekt wizualny może się różnić.
CMYK jest wartością przybliżoną: wartości zależą od profili ICC, papieru, atramentu, urządzeń i wydruku próbnego; użyj tego jako odniesienia, a nie wartości gotowej do druku
Brak alfa: to narzędzie nie przetwarza przezroczystości ani wartości rgba(), hsla(), #RGBA lub #RRGGBBAA.
Podzbiór kolorów CSS: nazwane kolory, przezroczysty, currentColor, HWB, HSV/HSB, Lab, LCH, OKLab, OKLCH, Display-P3, device-cmyk(), kolory względne, color-mix() i contrast-color() znajdują się poza tym narzędziem
Brak narzędzi do obrazków i palet: ta strona nie umożliwia próbkowania obrazów, zakraplacza ekranowego, generowania palet, generowania gradientów, sprawdzania współczynnika kontrastu, eksportowania zmiennych CSS ani eksportowania tokenów projektu

Prywatność i bezpieczeństwo

Przetwarzanie odbywa się w przeglądarce. Bieżący kolor może pozostać w aktualnej sesji przeglądarki. Po zapisaniu obszaru roboczego lub włączeniu WebDAV bieżący kolor może zostać zapisany lub zsynchronizowany jako część tego obszaru. Wyniki pochodne, historia cofania i tymczasowe błędy nie są zapisywane ani synchronizowane jako oddzielne dane, a narzędzie nie przechowuje listy ostatnich kolorów. Ta strona nie odczytuje obrazów, nie pobiera próbek ekranu, nie pobiera adresów URL ani nie wysyła kolorów do konwersji na serwerze. Na współdzielonych urządzeniach w razie potrzeby usuń kolor i dane witryny.

Najczęstsze pytania

5

Przejdź do kolejnego kroku z tymi powiązanymi narzędziami.

Całe przetwarzanie narzędzi odbywa się lokalnie w Twojej przeglądarce.