Представете си, че прелиствате изображения и намирате перфектния цвят – точния нюанс, от който се нуждаете за следващия си дизайнерски проект. В интернет има някои страхотни инструменти, които да ви помогнат да идентифицирате конкретни цветове във всяко приложение или уебсайт. Нека да разгледаме някои от най-добрите варианти за тях.
1. Използване на инструменти за програмисти в уеб браузър Chrome
Една опция, която можете да опитате, е инструментът за разработчици на Chrome. Chrome идва с много полезни функции за разработчиците, което прави задачите много по-лесни за изпълнение. Можете да използвате следните стъпки, за да идентифицирате конкретни цветове във всяко приложение или уебсайт.
- Отворете уебсайта, на който искате да идентифицирате цвят, в уеб браузъра Chrome
- Кликнете върху иконата с три точки в горния десен ъгъл на Chrome. Ще се появи изскачащ прозорец с куп опции.
- Щракнете върху „Още инструменти“ и след това изберете „Инструменти за разработчици“ от изскачащия прозорец.
- Използвайте Ctrl + Shift + I, ако искате да пропуснете горните стъпки
- Сега прозорецът се разделя на два екрана – уебсайтът вляво и кодът на уебсайта вдясно
- Въведете Ctrl + Shift + C на клавиатурата си. Това ви показва всички подробности за конкретен елемент на уебсайта, когато задържим курсора на мишката върху елементите.
- Можете да намерите цветния код на елемента заедно с друга полезна информация.
Пример
Да кажем, че се интересувате от специфичните цветови кодове за някои елементи на следния уебсайт:
Можете да изберете инструментите за разработчици, като щракнете върху трите точки в ъгъла на екрана. В падащото меню изберете Още инструменти, след това Инструменти за разработчици.
Екранът ще бъде визуално разделен на две страници. Ще видите уебсайта вляво и кода на сайта вдясно.
Въведете командата и прекия път „Ctrl + Shift + C“ и задръжте курсора на мишката върху елементите на уебсайта. Това ще покаже цвета на този елемент, заедно с друга полезна информация. По-долу са два примера, където намираме цвета на лентата за навигация и таблото за управление под инструмента за търсене.
Тук можем да намерим цветния код в изскачащия прозорец за навигационната лента. Цветовият код е #333333.
Цветът на таблото може да бъде намерен заедно с други полезни детайли. Цвят: #333333, Цвят на фона: #5D4A8E. Въпреки че в началото може да изглежда малко плашещо, програмата става много по-лесна за използване с малко практика.
2. Хром удължаване на капкомер за очи
Eye Dropper е популярно и широко използвано разширение за Chrome, което ви помага да намерите определени цветове на всеки уебсайт или приложение.
Следвайте стъпките по-долу, за да идентифицирате конкретни цветове на уебсайт или приложение, като използвате инструмента за разширение на капкомер за очи.
- Отворете всеки уебсайт или приложение в уеб браузъра Chrome
- Кликнете върху иконата за разширение на капкомер за очи
- Изберете „Избор на цвят от уеб страница“ и задръжте курсора на мишката върху различни елементи в приложението или уебсайта.
Можете да намерите цветния код на елементите, изброени в долния десен ъгъл на уеб страницата.
Пример
Добре, нека използваме инструмента за удължаване на капкомер в пример от реалния живот. Ще започнем с отваряне на уебсайт и натискане на иконата за разширение на капкомер за очи
Когато задържите курсора на мишката върху различни елементи на уебсайта, можете да видите как цветните кодове се появяват в секция в долния десен ъгъл на екрана.
Когато задържа курсора си върху V-образната икона, мога да видя цветния й код в долния прозорец, както е споменато. Предимството на този инструмент е, че можете да намерите и RGB кода заедно с шестнадесетичния цветен код на елемента. Методът е гъвкав за използване за тези, които искат прост и бърз начин да грабнат кодовете за любимите си цветове.