Что такое Определитель названия цвета?

Введите любое значение HEX, RGB или HSL и получите ближайший именованный цвет из базы более чем на 1500 названий. Код цвета превращается в имя, которое можно произнести вслух, — удобно, когда пишешь дизайн-документацию или обсуждаешь палитру с коллегой.

Имена берутся из открытой библиотеки color-name-list, на неё же опираются плагины Figma и расширения Tailwind. Можно ввести HEX, переключить ввод на RGB или HSL и вписать каналы или выбрать образец визуальным пикером. Инструмент находит ближайшее совпадение по евклидову расстоянию в RGB — и показывает его в HEX, RGB, HSL, HSV и CMYK — добавляя два альтернативных названия, показатель сходства и проверку контраста WCAG, так понятно, перед вами почти точное попадание или грубое приближение.

Как использовать

1. Шаг 1 — Введите цветовое значение в формате HEX (например, #3B82F6), переключите ввод на RGB или HSL и впишите каналы или выберите цвет визуально с помощью палитры.
2. Шаг 2 — Инструмент мгновенно находит ближайший именованный цвет и показывает точное расстояние совпадения.
3. Шаг 3 — Посмотрите название цвета, его точное HEX-значение и визуальное сравнение вашего ввода с именованным цветом.

Когда использовать

• Дать имя бренд-цвету, прежде чем заносить его в гайдлайн или дизайн-систему.
• Превратить цвет со скриншота в имя, по которому разработчик сможет найти переменную.
• Сверить образец краски или ткани с известной веб-палитрой и узнать стандартное название.

Результат

Разработчик вводит #4A90D9 и узнаёт, что ближайший цвет — "Steel Blue" (#4682B4) с показателем сходства 96,2%.

Частые вопросы

Откуда берутся эти названия цветов?

Из открытого проекта color-name-list. В нём около 1500 имён, собранных из опроса xkcd, каталогов производителей красок и спецификации CSS. Многие дизайн-инструменты используют ту же базу, так что имена выглядят узнаваемо.

Почему по некоторым входам сходство не доходит до 100%?

Только цвета, точно совпавшие с записью в списке, получают 100%. Остальным присваивается ближайший сосед по RGB-расстоянию. Выше 95% глаз разницы не видит, ниже 85% имя уже заметно мимо реального цвета.

Это RGB-расстояние или перцептивное?

Евклидово расстояние в RGB. Считается быстро и подходит для большинства веб-цветов. На сильно насыщенных красных и зелёных глаз чувствительнее, чем модель RGB, поэтому имя может оказаться чуть в стороне.

Можно вводить HSL, RGB или HEX напрямую?

Да — все три встроены. Переключите вкладку ввода на HEX, RGB или HSL и впишите значение либо выберите цвет пипеткой. В карточке результата подобранный цвет также показан в HSL, HSV и CMYK — копируйте тот формат, который нужен.

Почему два сильно разных HEX дают одно и то же имя?

В некоторых областях цветового пространства список разрежён, особенно среди приглушённых нейтралей и пастельных розовых. Когда оба входа далеки от любой записи, побеждает один и тот же ближайший сосед. Разрыв виден по проценту сходства.

Похожие инструменты