Color Picker
Pick colors and get HEX, RGB, HSL
R59
G130
B246
HEX
#3B82F6RGB
rgb(59, 130, 246)HSL
hsl(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ć
- Kliknij duży próbnik koloru, aby otworzyć natywny próbnik przeglądarki i wybrać kolor.
- Przeciągnij suwaki R, G i B, aby precyzyjnie dostosować poszczególne kanały kolorów.
- Kliknij Kopiuj obok HEX, RGB lub HSL, aby skopiować wartość do schowka.
- 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.