Смеситель цветов

• Мгновенное смешивание цветов: смешивайте два цвета в реальном времени, двигая ползунок соотношения. Меняйте режим смешивания и сразу видите обновлённый результат — без нажатия кнопок.
• Безопасно и приватно: ваши цвета смешиваются на 100 % на стороне клиента, в браузере. Ничего не отправляется на сервер, поэтому можно спокойно работать с брендовыми цветами и собственными палитрами.
• Три режима смешивания: выбирайте sRGB (стандарт CSS), Linear (с гамма-коррекцией) или Oklab (перцептивно равномерный). Каждый режим даёт разные визуальные результаты при одном и том же соотношении.
• 100 % бесплатно навсегда: полностью бесплатно, без регистрации, ограничений и рекламы, блокирующей интерфейс. Смешивайте цвета сколько угодно раз.

• Смешивание брендовых цветов: смешивайте основные цвета бренда, чтобы получить вторичные и третичные цвета палитры. Используйте предпросмотр градиента, чтобы найти точную среднюю точку по гайдлайнам бренда.
• Дизайн интерфейса и темизация: создавайте состояния наведения, неактивные состояния и тонированные фоны, смешивая основной цвет с белым или чёрным в разных пропорциях. Экспортируйте результаты прямо как значения CSS.
• Предпросмотр CSS color-mix(): посмотрите, как функция CSS color-mix() смешает два цвета, прежде чем писать код. Режим sRGB точно соответствует стандартному пространству смешивания CSS.
• Генерация палитр: создавайте плавные градиенты между двумя опорными цветами для визуализации данных, графиков и тепловых карт. Предпросмотр из 11 шагов показывает весь диапазон сразу.
• Обработка и ретушь фото: рассчитывайте точный цвет смешивания, нужный для попадания в целевой тон при ретуши. Используйте режим Oklab для перцептивно точного смешивания, соответствующего человеческому зрению.
• Доступность и контраст: смешивайте цвета переднего плана и фона, чтобы найти среднюю точку, улучшающую читаемость. Проверьте результат в анализаторе контраста на соответствие WCAG.

Смеситель цветов смешивает два цвета с настраиваемым соотношением и выдаёт полученный цвет в нескольких форматах. В отличие от простого среднего, смешивание цветов можно выполнять в разных цветовых пространствах — каждое даёт визуально отличающиеся результаты. Наш смеситель поддерживает три режима: sRGB (стандарт CSS), Linear (с гамма-коррекцией) и Oklab (перцептивно равномерный). Вся смесь рассчитывается мгновенно в браузере, без загрузки на сервер.

1. Введите два цвета: укажите любое значение HEX или RGB в полях цвета или используйте нативный выбор цвета. Смеситель принимает любой допустимый формат CSS-цвета.
2. Задайте соотношение смешивания: перетащите ползунок, чтобы определить долю каждого цвета. 50 % — равная смесь; 25 % — 75 % цвета 1 и 25 % цвета 2. Нажмите на любой шаг предпросмотра, чтобы перейти к нему.
3. Скопируйте результат: смешанный цвет показывается в HEX, RGB, HSL и HSV с кнопками копирования в один клик. Используйте предпросмотр градиента, чтобы исследовать весь диапазон между цветами.

• Смешивание sRGB: интерполирует напрямую между значениями каналов sRGB (0-255). Соответствует функции CSS color-mix(in srgb) и остаётся самым предсказуемым режимом для веб-разработки.
• Линейное смешивание: переводит цвета в линейный свет (снимает гамма-кодирование) перед смешиванием, а затем снова применяет гамму. Даёт физически более точные результаты при смешивании света — средние точки выглядят светлее, чем в sRGB.
• Смешивание Oklab: смешивает цвета в перцептивно равномерном пространстве Oklab. Средние точки выглядят визуально равноудалёнными от обоих исходных цветов, что позволяет избежать грязно-коричневых оттенков при смешивании дополнительных цветов в sRGB. Оптимально для дизайна и генерации палитр.
• Форматы вывода: смешанный цвет всегда возвращается в HEX, RGB, HSL и HSV. Все значения округляются до целого — аккуратный результат, готовый к копированию.