Калькулятор расстояния цвета
Измерьте, насколько визуально похожи или отличаются два цвета: введите два цвета HEX, чтобы получить евклидово расстояние RGB, взвешенное по восприятию расстояние redmean и оценку сходства на простом языке.
Ввод
Первый цвет HEX для сравнения.
Второй цвет HEX для сравнения.
Вывод
| Метрика | Значение |
|---|---|
| No data yet | |
Другие способы использовать этот инструмент
REST API
curl -X POST https://api.iotools.cloud/v1/tool/color-distance-calculator \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"colorA": "#000000",
"colorB": "#FFFFFF"
}'Подставьте свой собственный ключ из аккаунта. Поля инструмента — это тело запроса, без обёртки.
Спросите у ИИ-агента
Use the IOTools `color-distance-calculator` tool (Color Distance Calculator) on this input:
YOUR_INPUT_HEREВставьте это любому агенту, подключённому к MCP-серверу IOTools, и добавьте свой ввод.
Виджет для встраивания
<iframe
src="https://iotools.cloud/embed/color-distance-calculator/"
width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
title="Калькулятор расстояния цвета — iotools.cloud"
sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
allow="clipboard-write"
style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>Вставьте это на свою страницу — бесплатно, без ключа, нужна лишь обратная ссылка.
| Стоимость вызова API/MCP | От 5 кредитов |
|---|
Также доступно через
Руководства
Введите два цвета HEX, и этот инструмент измерит, насколько они визуально похожи или отличаются — полезно для проверки того, не сместился ли цвет бренда, удаления дубликатов палитры, выбора различимых цветов диаграмм или проверки того, что изменение токена дизайна тонкое, а не резкое.
Что означает «расстояние цвета»
Расстояние цвета — это числовая оценка того, насколько далеко друг от друга находятся два цвета. Самый простой подход рассматривает цвет как точку в трёхмерном пространстве RGB (красный, зелёный, синий, каждый от 0 до 255) и измеряет прямолинейное расстояние между двумя такими точками:
Евклидово расстояние RGB: √((R1−R2)² + (G1−G2)² + (B1−B2)²)
Это варьируется от 0 (идентичные цвета) до примерно 441,67 (чистый чёрный против чистого белого — две самые удалённые точки куба RGB). Легко вычислить, но не очень хорошо соответствует человеческому восприятию: глаз гораздо более чувствителен к некоторым оттенкам и диапазонам яркости, чем к другим, поэтому две пары с одинаковым евклидовым расстоянием могут выглядеть очень по-разному «далеко друг от друга».
Расстояние redmean — это известная и экономичная коррекция, которая взвешивает квадрат разности каждого канала в зависимости от яркости пары цветов (через среднее значение красного), приблизительно аппроксимируя чувствительность человека без затрат на полное преобразование цветового пространства:
ΔC = √((2 + r̄/256)×ΔR² + 4×ΔG² + (2 + (255−r̄)/256)×ΔB²), где r̄ — среднее значение двух красных.
Поскольку каналы взвешиваются более сильно, значения redmean для одной и той же пары выше, чем значения Евклида — они находятся в другом масштабе, а не в «более точной» версии одного и того же числа, поэтому сравнивайте их отдельно, а не ожидайте совпадения.
Как его использовать
- Введите или выберите Цвет A.
- Введите или выберите Цвет B.
- Таблица результатов обновляется мгновенно с обоими значениями в шестнадцатеричной системе, евклидовым расстоянием RGB, расстоянием redmean и оценкой сходства на простом языке (Идентичный, Очень похожий, Заметно отличается или Очень отличается) на основе евклидова балла.
FAQ
Какое число я должен действительно использовать? Для быстрой проверки здравомыслия («это в основном одинаковый цвет?»), евклидово расстояние простое и интуитивное. Если вы сравниваете цвета, которые человек будет смотреть рядом (палитры UI, проверки согласованности бренда), ориентируйтесь на значение redmean — оно точнее отслеживает воспринимаемую разницу.
Что считается «похожим»? Диапазоны оценок (0 = Идентичный, до 25 = Очень похожий, до 100 = Заметно отличается, выше 100 = Очень отличается) основаны на евклидовом расстоянии в его диапазоне 0–441,67. Это практическое правило, а не сертифицированный стандарт восприятия — для контраста доступности (читаемости текста) используйте вместо этого инструмент отношения контраста, поскольку контраст и расстояние цвета измеряют разные вещи.
Это учитывает цветовую слепоту? Нет. Обе формулы работают со стандартными значениями RGB и не моделируют никакую конкретную форму дефицита цветового зрения.
Могу ли я использовать трёхзначные шестнадцатеричные коды, такие как #f0c?
Да — сокращённая шестнадцатеричная запись (#rgb) автоматически расширяется до полной 6-значной формы перед сравнением.
Мои данные о цвете отправляются куда-то? Нет — всё работает полностью в вашем браузере. Ничего не загружается и не сохраняется.