Utilia
Категорії ▾
Мова: uk ▾

Пошук назви кольору

Дізнайтеся назву будь-якого кольору. Введіть код HEX або RGB і отримайте 5 найближчих назв із понад 30 000 іменованих кольорів і найближчу назву CSS.

Як користуватися пошуком назви кольору

  1. Виберіть колір за допомогою Вибрати колір або введіть значення в поле Код кольору: код HEX, як-от #1E90FF, rgb(30 144 255), hsl(210 100% 56%) чи будь-який інший колір CSS.
  2. Уперше інструмент завантажує свій список із приблизно 32 000 назв кольорів (кілька сотень кілобайтів, один раз за візит). Після цього результати з’являються під час введення.
  3. Прочитайте Найближча назва біля Ваш колір. Якщо код точно є у списку, підпис буде Точний збіг.
  4. Нижче перелічено 5 найближчих назв та Найближчі іменовані кольори CSS разом із кодом HEX і відстанню (ΔE). Скористайтеся Копіювати назву або Копіювати HEX, щоб забрати потрібне.
  5. Змініть Порівнювати за, щоб порівнювати за CIEDE2000 (CIELAB) або Відстань в OKLab, чи натисніть Випадковий колір, щоб дослідити палітру.

Колір і пошук залишаються у вашому браузері. Нічого з того, що ви вводите, не надсилається на сервер.

Звідки беруться назви

Назви походять із color-name-list, відкритої добірки, яку підтримують Девід Ерне та багато учасників за ліцензією MIT. Вона збирає близько 32 000 унікальних назв із каталогів фарб, історичних словників кольорів, природи, поп-культури та пропозицій спільноти: від «Absolute Zero» до «Zucchini». Кожна назва відповідає рівно одному коду HEX. Назви кольорів у списку англійською, а не українською: інструмент знаходить найближчу англомовну назву.

Інструмент також порівнює ваш колір зі 148 іменованими кольорами CSS із CSS Color Level 4 (tomato, rebeccapurple, dodgerblue…), які розуміє кожен браузер. Синоніми з одним кодом показано разом, наприклад gray / grey або aqua / cyan. Ці назви варто використовувати в таблиці стилів, коли потрібне щось читабельне.

Як вибирається найближчий колір

Порівнювати коди HEX цифра за цифрою не годиться: #808080 і #7F8080 майже однакові, але невелика зміна в іншому каналі може виглядати зовсім по-іншому. Інструмент перетворює кожен колір на перцептивний колірний простір і вимірює відстані там.

  • CIEDE2000 (CIELAB) – формула колірної різниці Міжнародної комісії з освітлення, яку застосовують у друку й підборі фарб. Вона виправляє давнішу відстань CIELAB з огляду на те, як наші очі оцінюють світлість, насиченість і відтінок, особливо в синіх і майже сірих кольорах. Реалізація відповідає Шарма, Ву та Далал (2005) і перевірена на їхніх еталонних даних.
  • Відстань в OKLab – пряма відстань в OKLab, сучасному просторі, створеному для рівномірних сприйнятих кроків. Її показано помноженою на 100, щоб вона читалася за шкалою, подібною до ΔE2000. Вона швидша й часто збігається з CIEDE2000, а коли розходиться, різниця непомітна.

Як орієнтир: ΔE менше за 1 непомітна для більшості людей, від 1 до 2 – дуже незначна різниця, яку видно поруч, а понад 5 кольори помітно відрізняються. Якщо найближча назва має велику ΔE, ваш колір просто потрапляє між іменованими кольорами.

Як можна використати назви кольорів

  • Давайте дизайн-токенам і зразкам палітри дружніші назви, ніж код.
  • Описуйте колір в електронному листі, картці товару чи альтернативному тексті.
  • Знаходьте ключове слово CSS, близьке до фірмового кольору, для швидких прототипів.

Поширені запитання

Яка назва кольору #1E90FF?

Його назва в CSS – dodgerblue, яскравий блакитний, а великий список спільноти називає його «Clear Chill» (точний збіг). Введіть будь-який інший код, щоб так само знайти найближчі назви.

Чому деякі назви незвичні?

Список створила спільнота, і в ньому є жартівливі назви з поп-культури та природи. Подивіться на п’ять найближчих результатів і виберіть той, що пасує вашому контексту. Іменовані кольори CSS – найстандартніші.

Чи найближча назва точно відповідає моєму кольору?

Лише коли підпис каже Точний збіг, а ΔE дорівнює 0. В іншому разі назва належить сусідньому кольору: порівняйте обидва зразки поруч.

Яким способом порівняння користуватися?

CIEDE2000 – усталений галузевий стандарт і типовий варіант. Відстань в OKLab – добра сучасна альтернатива. Спробуйте обидва, коли колір лежить між двома назвами.

Чи можна шукати за назвою замість коду?

У цьому інструменті ні. Проте в полі Код кольору можна ввести будь-яку зі 148 назв кольорів CSS, наприклад salmon, і побачити інші назви, близькі до неї.

Схожі інструменти