Kroplomierz kolorów z obrazu

Potrzebujesz sprawdzić, jaki kolor jest w logo, na zdjęciu albo na zrzucie ekranu? Wgraj obraz, najedź kursorem na interesujące Cię miejsce i kliknij. Kod koloru od razu trafia do schowka w formacie, który wybierzesz: HEX, RGB, HSL, HSV lub LCH. Nic nie instalujesz, a obraz nie opuszcza Twojego komputera.

Jak sprawdzić kolor z obrazu

1. Wgraj obraz. Przeciągnij go do okna albo kliknij „Przeglądaj pliki”. Kroplomierz obsługuje JPG, PNG, WebP i GIF.
2. Wybierz format. Nad obrazem ustaw, w jakim zapisie chcesz kopiować kolor. Do sieci zwykle pasuje HEX, do programów graficznych RGB. Narzędzie zapamięta Twój wybór.
3. Najedź na kolor. Przy kursorze pojawi się lupa z powiększonymi pikselami z otoczenia, a pod nią kod koloru.
4. Kliknij. Kod trafia do schowka, a kolor zapisuje się w zakładce Wybrane kolory. Wystarczy go wkleić tam, gdzie potrzebujesz.

Chcesz sprawdzić inny obraz? Przeciągnij go bezpośrednio na obecny albo usuń go ikoną kosza.

Co potrafi ten kroplomierz online

Lupa, która pokazuje każdy piksel

Zwykła pipeta pokazuje tylko kolor pod kursorem, więc trafienie w cienką krawędź litery bywa loterią. Nasza lupa powiększa otoczenie kursora do 11 × 11 pikseli i obramowuje ten środkowy. Widzisz dokładnie, w co klikniesz, zanim to zrobisz.

Zoom aż do pojedynczych pikseli

Przyciskami plus i minus albo kółkiem myszy z wciśniętym Ctrl przybliżysz obraz nawet 64 razy. Po włączeniu siatki zobaczysz granice pikseli, więc przy ikonach, pixel arcie czy drobnym tekście klikniesz dokładnie tam, gdzie chcesz.

Kolor z oryginału, nie z miniatury

Wiele narzędzi online najpierw pomniejsza obraz i czyta kolor z podglądu, gdzie sąsiednie piksele się zlewają. Nasz kroplomierz pracuje na obrazie w pełnej rozdzielczości (do 4096 px na dłuższym boku), więc dostajesz rzeczywisty kolor piksela.

Kopiowanie jednym kliknięciem

Żadnego zaznaczania tekstu ani przepisywania liczb. Każde kliknięcie w obraz kopiuje kod w wybranym formacie. Gdy potrzebujesz tego samego koloru w innym zapisie, szczegóły koloru pokazują wszystkie pięć formatów, każdy z własnym przyciskiem kopiowania.

Paleta dominujących kolorów

Zaraz po wgraniu narzędzie znajduje do ośmiu kolorów, które dominują w obrazie, i pokazuje je w zakładce Dominujące kolory. Niemal identyczne odcienie są łączone, więc w palecie nie znajdziesz pięciu wariantów szarości, a przezroczyste fragmenty PNG są pomijane. Paleta sprawdza się jako punkt wyjścia do schematu kolorów strony, prezentacji albo postów w mediach społecznościowych. Czy kolory zachowują wystarczający kontrast bez odcienia, szybko sprawdzisz konwersją obrazu na odcienie szarości.

Wybrane kolory zawsze pod ręką

Każdy kolor, w który klikniesz, trafia do zakładki Wybrane kolory (ostatnie 24). Możesz porównać kilka miejsc na obrazie i wrócić do nich w każdej chwili. Na dużym ekranie panel z kolorami znajduje się od razu obok obrazu.

Do czego przyda się kod koloru z obrazu

• Strony i aplikacje: Klient przesłał logo tylko jako JPG, a Ty potrzebujesz dokładnego koloru marki do CSS. Gdy potrzebujesz też wersji z przezroczystym tłem, skorzystaj z usuwania tła ze zdjęcia.
• Grafika i media społecznościowe: Chcesz, żeby tekst na poście pasował kolorem do zdjęcia. Pobierz kolor bezpośrednio z niego.
• Prezentacje i dokumenty: Kolory firmowego logo ustawisz w PowerPoincie, Google Slides albo Canvie przez HEX lub RGB.
• Kontrola projektu: Na zrzucie ekranu sprawdzisz, czy przycisk w aplikacji naprawdę ma kolor, jaki przewiduje projekt. Rozmiar eksportowanych grafik sprawdzisz w analizie wymiarów obrazów.
• Wnętrza i moda: Masz zdjęcie tkaniny albo ściany i szukasz podobnego odcienia. Kod posłuży jako punkt wyjścia przy wyborze w wzorniku.

Formaty kolorów, które zwraca kroplomierz

• HEX (#1373b6): zapis dla HTML, CSS i większości narzędzi graficznych.
• RGB (rgb(19, 115, 182)): udział czerwonego, zielonego i niebieskiego, każdy od 0 do 255. Jak działa addytywne mieszanie kolorów, opisuje Wikipedia.
• HSL (hsl(205, 81%, 39%)): odcień, nasycenie i jasność. Łatwo z niego przygotować jaśniejszy albo ciemniejszy wariant.
• HSV: odcień, nasycenie i wartość, znane z wyboru koloru w Photoshopie czy GIMP-ie. Ten model, blisko spokrewniony z HSL, opisuje Wikipedia.
• LCH: model, który odpowiada temu, jak kolory postrzega ludzkie oko. Kopiowany jest w zapisie, który rozumie nowoczesny CSS (zobacz dokumentację MDN, po angielsku).

Kroplomierz sprawdzi kolor z obrazu. Gdy chcesz go dalej dopracować, przekonwertować na inne formaty albo znaleźć pasujące odcienie, przejdź do koła barw.

Często zadawane pytania

Czy mój obraz jest wysyłany na serwer?

Nie. Obraz jest wczytywany i przetwarzany bezpośrednio w Twojej przeglądarce, nigdzie nie jest wysyłany i po zamknięciu strony nic po nim nie zostaje. Kroplomierza możesz więc spokojnie użyć nawet przy wewnętrznych materiałach czy niepublikowanych projektach.

Jak sprawdzić kod HEX koloru ze zdjęcia?

Wgraj zdjęcie, zostaw wybrany format HEX nad obrazem i kliknij miejsce z kolorem, którego szukasz. Kod, na przykład #75dab2, masz od razu w schowku.

Dlaczego kolor ze zdjęcia różni się od rzeczywistości?

Aparat wpływa na kolory przez oświetlenie, balans bieli i kompresję. Kroplomierz zwraca dokładnie ten kolor, który jest zapisany w pliku. Przy zdjęciach kliknij więc kilka miejsc i porównaj je w zakładce Wybrane kolory. Gdy na podstawie kodu mieszasz kolor na ścianę, traktuj go jako orientacyjny.

Czy kroplomierz działa na telefonie?

Tak. Na ekranie dotykowym wystarczy dotknąć miejsca na obrazie, a kod skopiuje się tak samo jak na komputerze. Lupa przy kursorze nie pokazuje się na telefonie, więc przy drobnych szczegółach najpierw przybliż obraz.

Jaka jest różnica między HEX a RGB?

Oba zapisy opisują ten sam kolor. RGB wyraża go trzema liczbami od 0 do 255, HEX zapisuje te same liczby w systemie szesnastkowym za znakiem #. Na przykład rgb(255, 87, 51) to to samo co #ff5733.

Jak z obrazu uzyskać całą paletę kolorów?

Otwórz zakładkę Dominujące kolory. Znajdziesz w niej do ośmiu głównych kolorów obrazu, a kliknięcie w dowolny z nich skopiuje jego kod.