Jak zidentyfikować określony kolor w aplikacji lub witrynie?

Wyobraź sobie, że przewijasz obrazy i znajdujesz idealny kolor — dokładnie taki odcień, jakiego potrzebujesz do następnego projektu. W Internecie jest kilka niesamowitych narzędzi, które pomogą Ci zidentyfikować określone kolory w dowolnej aplikacji lub witrynie. Rzućmy okiem na niektóre z najlepszych ich opcji.

1. Korzystanie z narzędzi programistycznych w przeglądarce internetowej Chrome

Jedną z opcji, którą możesz wypróbować, jest narzędzie dla programistów Chrome. Chrome zawiera wiele przydatnych funkcji dla programistów, co znacznie ułatwia wykonywanie zadań. Możesz wykonać następujące czynności, aby zidentyfikować określone kolory w dowolnej aplikacji lub witrynie internetowej.

• Otwórz stronę, na której chcesz zidentyfikować kolor w przeglądarce Chrome Chrome
• Kliknij ikonę z trzema kropkami w prawym górnym rogu Chrome. Pojawi się wyskakujące okienko z kilkoma opcjami.
• Kliknij „Więcej narzędzi”, a następnie wybierz „Narzędzia programistyczne” z wynikowego wyskakującego okienka.
• Użyj Ctrl + Shift + I, jeśli chcesz pominąć powyższe kroki
• Teraz okno dzieli się na dwa ekrany – strona po lewej stronie i kod strony po prawej
• Wpisz Ctrl + Shift + C na klawiaturze. To pokazuje wszystkie szczegóły konkretnego elementu na stronie internetowej, gdy najedziemy kursorem myszy na elementy.
• Możesz znaleźć kod koloru elementu wraz z innymi przydatnymi informacjami.

Przykład

Załóżmy, że interesują Cię kody kolorów niektórych elementów na następującej stronie internetowej:

Możesz wybrać narzędzia programistyczne, klikając trzy kropki w rogu ekranu. Z menu rozwijanego wybierz Więcej narzędzi, a następnie Narzędzia programistyczne.

Ekran zostanie wizualnie podzielony na dwie strony. Po lewej stronie zobaczysz witrynę, a po prawej jej kod.

Wpisz polecenie i skrót „Ctrl + Shift + C” i najedź kursorem myszy na elementy witryny. To pokaże kolor tego elementu wraz z innymi przydatnymi informacjami. Poniżej dwa przykłady, w których znajdujemy kolor paska nawigacyjnego i pulpitu pod wyszukiwarką.

Tutaj możemy znaleźć kod koloru w wyskakującym okienku paska nawigacyjnego. Kod koloru to #333333.

Kolor deski rozdzielczej można znaleźć wraz z innymi przydatnymi detalami. Kolor: #333333, Kolor tła: #5D4A8E. Chociaż na początku może to wyglądać nieco onieśmielająco, program staje się znacznie łatwiejszy w użyciu przy odrobinie praktyki.

2. Rozszerzenie Chrome zakraplacz do oczu

Eye Dropper to popularne i szeroko stosowane rozszerzenie Chrome, które pomaga znaleźć określone kolory w dowolnej witrynie lub aplikacji.

Wykonaj poniższe czynności, aby zidentyfikować określone kolory w witrynie lub aplikacji za pomocą narzędzia rozszerzenia Eye Dropper.

• Otwórz dowolną witrynę lub aplikację w przeglądarce Chrome
• Kliknij ikonę rozszerzenia zakraplacza
• Wybierz opcję „Wybierz kolor ze strony internetowej” i najedź kursorem myszy na różne elementy w aplikacji lub witrynie.

Kod koloru elementów wymienionych w prawym dolnym rogu strony internetowej.

Przykład

OK, użyjmy narzędzia do przedłużania kroplomierza na przykładzie z życia. Zaczniemy od otwarcia strony internetowej i kliknięcia ikony rozszerzenia Eye Dropper

Gdy najedziesz kursorem na różne elementy witryny, zobaczysz kody kolorów pojawiające się w sekcji w prawym dolnym rogu ekranu.

Kiedy najeżdżam kursorem na ikonę w kształcie litery V, widzę jej kod koloru w dolnym oknie, jak wspomniano. Zaletą tego narzędzia jest to, że możesz również znaleźć kod RGB wraz z szesnastkowym kodem koloru elementu. Metoda jest elastyczna dla tych, którzy chcą w prosty i szybki sposób pobrać kody swoich ulubionych kolorów.