Jak Konwertować Kolory Między HEX, RGB i HSL
Szybka odpowiedź
Aby skonwertować kolor: otwórz Color Converter, wprowadź kolor w dowolnym formacie (HEX, RGB, HSL) i narzędzie wyświetla natychmiast odpowiedniki we wszystkich innych formatach. Cała konwersja odbywa się lokalnie —żadne dane nie są uploadowane.
Wstęp
Kolory mogą być reprezentowane w wielu formatach: HEX (#ff6600), RGB (rgb(255, 102, 0)), HSL (hsl(24, 100%, 50%)) i innych. Różne narzędzia i konteksty używają różnych formatów —CSS często HEX lub RGB, design tools HSL, a API dowolnego. Konwersja między formatami pozwala użyć koloru z jednego systemu w kontekście wymagającym innego.
Krok po kroku
-
Otwórz narzędzie Konwerter kolorów
Przejdź do strony narzędzia Konwerter kolorów. Narzędzie obsługuje formaty HEX, RGB, HSL, HSV i CMYK.
-
Podaj swój kolor
Wpisz lub wklej wartość koloru w dowolnym obsługiwanym formacie. Przykłady: „#ff6600”, „rgb(255, 102, 0)”, „hsl(24, 100%, 50%)”. Narzędzie automatycznie wykrywa format wejściowy.
-
Przejrzyj wszystkie odpowiedniki formatu
Narzędzie wyświetla kolor jednocześnie we wszystkich formatach: HEX, RGB, HSL, HSV i CMYK. Wyświetla także próbkę podglądu kolorów, dzięki czemu można sprawdzić, czy konwersja jest prawidłowa.
-
Skopiuj potrzebny format
Kliknij przycisk Kopiuj obok dowolnego formatu, aby skopiować tę wartość do schowka. Użyj go w swoim CSS, narzędziu do projektowania lub aplikacji.
-
Dostosuj kolor (opcjonalnie)
Niektóre narzędzia pozwalają dostosować kolor za pomocą suwaków (dla HSL: odcień, nasycenie, jasność) i zobaczyć aktualizację wszystkich formatów w czasie rzeczywistym. Jest to przydatne do wyszukiwania powiązanych kolorów lub odcieni.
Przykłady
HEX do RGB i HSL
Wejście: #ff6600
Wyjście: __ZACHOWAJ_34__: rgb(255, 102, 0)
__ZACHOWAJ_36__: hsl(24, 100%, 50%)
__ZACHOWAJ_34__ do __ZACHOWAJ_35__
Wejście: RGB(0, 128, 255)
Wyjście: HEX: #0080 i nast
__ZACHOWAJ_36__: hsl(210, 100%, 50%)
__ZACHOWAJ_36__ do __ZACHOWAJ_35__
Wejście: hsl(120, 100%, 50%)
Wyjście: __ZACHOWAJ_35__: #00ff00
__ZACHOWAJ_34__: rgb(0, 255, 0)
Typowe problemy
- HEX z vs bez # — niektóre narzędzia wymagają przedrostka #, inne nie. Nasz konwerter akceptuje oba.
- 3-cyfrowy a 6-cyfrowy HEX —#f60 jest skrótem od #ff6600. Obydwa są ważne; konwerter normalizuje do 6 cyfr.
- __ZACHOWAJ_36__ zakres odcieni — odcień wynosi 0-360 stopni (okrąg). Zarówno 0, jak i 360 są czerwone. Wartości powyżej 360 zawijają się.
- Różnice w przestrzeni kolorów —HEX, RGB i HSL to sRGB. CMYK to inna przestrzeń barw (druku) i konwersja jest przybliżona.
Porady
- Użyj HSL do tworzenia odmian kolorów — dostosowywanie odcienia, nasycenia i jasności jest bardziej intuicyjne niż RGB.
- Użyj HEX zamiast CSS — jest to najbardziej kompaktowy i szeroko obsługiwany format w arkuszach stylów.
- Użyj RGB, jeśli chcesz ustawić przezroczystość alfa — rgb(255, 102, 0, 0.5) dla 50% krycia (lub użyj 8-cyfrowego HEX: #ff660080).
- Skorzystaj z naszego Konwertera kolorów, aby uzyskać natychmiastową, prywatną konwersję pomiędzy wszystkimi formatami kolorów.