Color Picker

Wybierz kolory i do dzieła — bez zbędnego zachodu

Zbudowaliśmy Color Picker w 2025 roku, bo mieliśmy dość ciężkich aplikacji i zbyt skomplikowanych narzędzi do kolorów. Jako frontendowcy i ilustratorzy potrzebowaliśmy sposobu, by szybko złapać kolor, lekko go skorygować i iść dalej. Zaczęło się jako narzędzie wewnętrzne, stało się ulubieńcem zespołu; dopracowaliśmy je i udostępniliśmy w sieci wszystkim. Bez kont i bez krzywej uczenia — otwórz stronę, wybierz ton i skopiuj kody HEX, RGB, HSL lub HSV.

Dlaczego nasz próbnik kolorów się podoba

Jeśli kiedykolwiek patrzyłeś/aś na projekt i myślałeś/aś „jak trafić w ten konkretny ton?”, docenisz prostotę Color Picker. Interfejs celowo utrzymaliśmy minimalistyczny:

• Jedno kliknięcie — i kolor jest Twój — stuknij w dowolny punkt palety, a potrzebne wartości pojawią się od razu. Potrzebujesz próbki ze zdjęcia lub zrzutu ekranu? Upuść plik na stronę i użyj próbnika.
• Gradienty bez wysiłku — dodawaj i przesuwaj przystanki na pasku, by uzyskać jedwabiste przejścia. Przełączaj liniowy/promienisty, dopracuj kąt i krycie, a następnie skopiuj CSS.
• Bez ograniczeń, bez kosztów — Color Picker działa w każdej nowoczesnej przeglądarce na komputerze, tablecie i telefonie. Nic nie instalujesz, nie ma opłat.
• Rozszerzenia, gdy ich potrzebujesz — nasze opcjonalne rozszerzenia Chrome i Edge przenoszą próbnik prosto do przeglądarki, dzięki czemu pobierzesz próbkę z każdej strony i zachowasz historię.

Do czego

Ludzie korzystają z Color Picker na wiele sposobów:

• Projektanci i zespoły produktowe używają go przy szkicowaniu interfejsów i palet marki. Eksplorowanie kombinacji i kopiowanie CSS dla gradientów jest szybkie.
• Ilustratorzy i artyści sięgają po próbnik, by czerpać inspiracje ze zdjęć i malarstwa. Narzędzie gradientu pomaga planować miękkie cieniowanie i przejścia barw.
• Deweloperzy front-end polegają na nim, by generować spójne wartości kolorów w różnych projektach. Rozszerzenie ułatwia pobieranie próbek z istniejących witryn.
• Każdy, kto sprawdza dostępność może oglądać kolory w różnych modelach i regulować krycie, aż spełnią wytyczne kontrastu.

Pierwsze kroki

Instrukcja niepotrzebna — oto szybki przegląd:

• Wybierz kolor — kliknij w dowolnym miejscu palety. Natychmiast zobaczysz wartości HEX, RGB i HSV. Dopracuj odcień, nasycenie, jasność i krycie suwakami.
• Pobierz próbkę z obrazu — przeciągnij plik obrazu na stronę lub wybierz go. Kliknij wybrany piksel, a pojawią się kody koloru.
• Utwórz gradient — kliknij pasek gradientu, aby dodać przystanki, i przeciągaj je; przełączaj między stylem liniowym a promienistym. Koryguj kąt i krycie, aż będzie idealnie.
• Kopiuj i używaj ponownie — Twoje kolory i gradienty zapisują się automatycznie. Skopiuj kody lub CSS i wklej do projektu albo udostępnij zespołowi.