Konwerter kolorów
Wprowadź kod koloru hex, aby zobaczyć jego odpowiedniki RGB i HSL z wartościami kanałów czerwonego, zielonego i niebieskiego.
Jak korzystać z tego konwertera kolorów
- Wprowadź kod koloru hex
Wpisz 6-cyfrowy kod hex w polu kodu koloru Hex (np. FF6B35 lub 00FF88). Pomiń symbol #.
- Odczytaj wartości RGB
Wyniki dla kanałów czerwonego (Red), zielonego (Green) i niebieskiego (Blue) pokazują wartości od 0 do 255 dla każdego komponentu.
- Sprawdź wynik HSL
Przejrzyj wynik HSL dla odcienia (0–360°), nasycenia i jasności — przydatne przy korekcie kolorów.
Jak działa ten konwerter kolorów
To narzędzie konwertuje szesnastkowy kod koloru na reprezentacje RGB (czerwony, zielony, niebieski) oraz HSL (odcień, nasycenie, jasność). Każda para szesnastkowa odpowiada 8-bitowej wartości kanału (0–255), a konwersja HSL wykorzystuje standardową matematykę przestrzeni barw.
R = hex[0:2] → dziesiętny; G = hex[2:4] → dziesiętny; B = hex[4:6] → dziesiętny Hex #FF6B35 → RGB(255, 107, 53) → HSL(16, 100%, 60%).
Hex 000000 → RGB(0, 0, 0) → HSL(0, 0%, 0%) — czysta czerń.
Hex FFFFFF → RGB(255, 255, 255) → HSL(0, 0%, 100%) — czysta biel. Hex 808080 → RGB(128, 128, 128) → HSL(0, 0%, 50%) — średni szary.
- ✓ Wprowadzone dane to poprawny 6-cyfrowy szesnastkowy kod koloru.
- ✓ Kanał alfa nie jest obsługiwany w tej wersji.
- Konwersja CMYK wymaga profilu kolorów i nie jest tutaj uwzględniona.
Zrozumienie modeli kolorów
HEX, RGB i HSL to różne sposoby opisu tego samego koloru. HEX koduje RGB jako 6-cyfrowy ciąg szesnastkowy: każda para znaków to jeden 8-bitowy kanał (0–255). RGB wyraża te same wartości jako trzy liczby, czyli addytywne kolory podstawowe emitowane przez ekrany. HSL (Hue, Saturation, Lightness) to model cylindryczny: odcień (hue) to kąt na kole kolorów (0° czerwony, 120° zielony, 240° niebieski), nasycenie (saturation) to intensywność koloru, a jasność (lightness) to poziom rozświetlenia. Projektanci często preferują HSL przy programowej regulacji kolorów — zmiana samej jasności przyciemnia lub rozjaśnia kolor bez zmiany odcienia, a modyfikacja nasycenia reguluje żywość barwy.
Zastosowania konwersji kolorów dla programistów
Programiści konwertują kolory podczas budowania systemów projektowych, wdrażania motywów, generowania palet kolorów i debugowania CSS. Tokeny projektowe często przechowują kolory w formacie hex; konwersja na RGB lub HSL umożliwia obliczenia w czasie rzeczywistym, takie jak nakładanie przezroczystości czy sprawdzanie kontrastu pod kątem dostępności. Przełączniki motywów mogą wymagać wygenerowania jaśniejszych lub ciemniejszych wariantów z koloru bazowego przy użyciu HSL. Automatyczne narzędzia do sprawdzania dostępności konwertują kolory, aby obliczyć luminancję i współczynniki kontrastu. Podczas debugowania błędów układu lub motywów, podgląd wartości hex jako RGB lub HSL pomaga zidentyfikować, który kanał jest błędny. Konwersja kolorów jest również wykorzystywana w wizualizacji danych, bibliotekach wykresów i dynamicznym motywowaniu interfejsu użytkownika.
Często zadawane pytania
Czy mogę wprowadzić 3-cyfrowy kod hex?
Obecnie narzędzie to wymaga 6-cyfrowego kodu. W przypadku 3-cyfrowych skrótów, takich jak F60, należy je najpierw rozwinąć do FF6600.
Co to jest HSL?
HSL to skrót od Hue (odcień), Saturation (nasycenie) i Lightness (jasność). Jest to alternatywny sposób opisywania kolorów, który niektórzy projektanci uważają za bardziej intuicyjny niż RGB.