Введите цвет в формате CMYK и мгновенно получите точное значение HEX, а заодно все остальные форматы. Работает прямо в браузере.
Когда нужен перевод CMYK в HEX
Когда цвет печатного буклета нужен в таблице стилей, HTML-письме или теме презентации, итоговым значением обычно служит одна строка HEX. Страница пропускает промежуточный шаг: введите четыре процента и получите код, готовый для вставки в CSS-переменную, стиль Figma или брендбук. Это удобно веб-командам, которые получают от агентств печатные задания и хотят быстро увидеть читаемые значения, не открывая InDesign. Ждите экранного приближения, а не совпадения, проверенного по цветовому профилю, и сверяйте его с образцом.
Где это пригодится
- Вставить цвет из печатного задания агентства в CSS-переменную --brand-accent в стилях сайта.
- Заполнить поле собственного цвета в PowerPoint, Google Slides или Canva кодом HEX из спецификации CMYK.
- Получить первый HEX для шаблона HTML-письма на основе цветов печатной рассылки.
Как перевести CMYK в HEX
Приведите R, G и B к диапазону 0-1. Чёрная компонента K = 1 − max(R′, G′, B′). Остальные каналы: C = (1 − R′ − K) / (1 − K), M = (1 − G′ − K) / (1 − K), Y = (1 − B′ − K) / (1 − K).
Обратный перевод: R = 255 × (1 − C) × (1 − K), аналогично G из M и B из Y. Важно: это стандартная формула без управления цветом; реальный результат печати зависит от ICC-профиля машины, красок и бумаги, поэтому считайте значения отправной точкой.
Значения HEX сначала переводятся в RGB: код делится на три base-16 пары, затем применяются формулы.
Пример расчёта
CMYK в RGB
- R = 255 × (1 − C) × (1 − K) = 255 × (1 − 0) × (1 − 0.15) = 217
- G = 255 × (1 − M) × (1 − K) = 255 × (1 − 0.25) × (1 − 0.15) = 163
- B = 255 × (1 − Y) × (1 − K) = 255 × (1 − 0.95) × (1 − 0.15) = 11
RGB в HEX
- R: 217 ÷ 16 = 13, остаток 9 → D9
- G: 163 ÷ 16 = 10, остаток 3 → A3
- B: 11 ÷ 16 = 0, остаток 11 → 0B
cmyk(0%, 25%, 95%, 15%) = #D9A30B
Совет: Записывайте исходное CMYK и полученный HEX в одном файле токенов под разными именами, например brand-blue-print и brand-blue-web. Тогда изменение с любой стороны видно, и никто не гадает, какое значение первично.
Популярные цвета: CMYK в HEX
| Цвет | CMYK | HEX |
|---|---|---|
| Красный | cmyk(0%, 100%, 100%, 0%) | #FF0000 |
| Оранжевый | cmyk(0%, 35%, 100%, 0%) | #FFA500 |
| Жёлтый | cmyk(0%, 0%, 100%, 0%) | #FFFF00 |
| Лайм | cmyk(100%, 0%, 100%, 0%) | #00FF00 |
| Зелёный | cmyk(100%, 0%, 100%, 50%) | #008000 |
| Голубой | cmyk(100%, 0%, 0%, 0%) | #00FFFF |
| Бирюзовый | cmyk(100%, 0%, 0%, 50%) | #008080 |
| Синий | cmyk(100%, 100%, 0%, 0%) | #0000FF |
| Тёмно-синий | cmyk(100%, 100%, 0%, 50%) | #000080 |
| Фиолетовый | cmyk(0%, 100%, 0%, 50%) | #800080 |
| Пурпурный | cmyk(0%, 100%, 0%, 0%) | #FF00FF |
| Розовый | cmyk(0%, 25%, 20%, 0%) | #FFC0CB |
| Коричневый | cmyk(0%, 75%, 75%, 35%) | #A52A2A |
| Серый | cmyk(0%, 0%, 0%, 50%) | #808080 |
| Чёрный | cmyk(0%, 0%, 0%, 100%) | #000000 |
| Белый | cmyk(0%, 0%, 0%, 0%) | #FFFFFF |
Часто задаваемые вопросы
Могут ли те же значения CMYK дать другой HEX в другой программе?
Да, если программа применяет ICC-профиль или другой метод пересчёта. Здесь работает простая формула, поэтому одни и те же четыре числа всегда дают один HEX, а Photoshop с профилем печатного станка может выдать более блёклый результат.
Как проверить, что HEX похож на печатный образец?
Посмотрите HEX на ярком экране с нейтральной белой точкой и сравните с образцом при дневном свете, а не под тёплой лампой. Если на экране цвет ярче, слегка снизьте насыщенность в HSL и сохраните скорректированное значение в брендбуке.
Почему цвет на печати отличается от экрана?
Экран смешивает свет (аддитивная модель RGB), а печать смешивает краски (субтрактивная CMYK), и печатный охват уже. Точный результат зависит от ICC-профиля, красок и бумаги: конвертер использует стандартную формулу без управления цветом, поэтому значения приблизительны.
Что такое канал K?
K означает чёрную краску (key). Печать чёрного отдельной краской вместо смешения 100% голубого, пурпурного и жёлтого даёт более глубокий чёрный, чёткий текст и экономит краску.
Можно ли использовать CMYK в CSS?
Нет, веб работает в RGB. Переведите значения CMYK в HEX или RGB перед использованием на сайте; именно это и делает этот конвертер.
Другие конвертеры цветов
Нужно определить цвет пикселя на картинке или скриншоте? Попробуйте бесплатную пипетку цвета →