TL
Tool Lab
💰Donate
💰Donate

Color Picker

Pick colors and get HEX, RGB, HSL

R59
G130
B246
HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)

O tym narzędziu

Próbnik kolorów pozwala wizualnie wybrać dowolny kolor i natychmiast zobaczyć jego reprezentacje HEX, RGB i HSL. Użyj natywnego próbnika do szerokiego wyboru lub suwaków RGB do precyzyjnej kontroli na poziomie kanałów.

Wybrane kolory są automatycznie zapisywane w historii ostatnich kolorów, dzięki czemu możesz szybko do nich wrócić bez ponownego wpisywania. Przydatne przy porównywaniu wariantów kolorów lub budowaniu palety.

Jak używać

  1. Kliknij duży próbnik koloru, aby otworzyć natywny próbnik przeglądarki i wybrać kolor.
  2. Przeciągnij suwaki R, G i B, aby precyzyjnie dostosować poszczególne kanały kolorów.
  3. Kliknij Kopiuj obok HEX, RGB lub HSL, aby skopiować wartość do schowka.
  4. Skopiowane kolory pojawiają się w wierszu Ostatnie kolory — kliknij próbnik, aby go przywrócić.

Przypadki użycia

Projektanci stron wybierają dokładne kolory z przewodnika marki i kopiują kody hex do CSS. Programiści dostosowują wartości RGB dla canvas lub WebGL. Projektanci UI porównują subtelne wariacje tego samego odcienia.

Często zadawane pytania

  • Czy wybrane kolory są trwale zapisywane?Nie. Ostatnie kolory są przechowywane w stanie komponentu i resetowane po opuszczeniu strony lub odświeżeniu. Dla trwałego przechowywania skopiuj kody hex do swoich notatek.
  • Czy mogę wpisać kod hex bezpośrednio?Tak. Użyj pola wprowadzania hex w natywnym próbniku (dostępnego w większości przeglądarek), aby wpisać wartość hex bezpośrednio.
  • Czym jest HSL i dlaczego jest przydatne?HSL to skrót od Hue (Odcień), Saturation (Nasycenie) i Lightness (Jasność). Zmiana jasności sprawia, że kolor jest jaśniejszy lub ciemniejszy przy zachowaniu tego samego odcienia, co jest przydatne do generowania tintów i shades.