Utilia

Конвертер кольорів

Конвертуйте колір між HEX, RGB, HSL, HSV, HWB, CMYK, LAB, LCH і OKLCH. Вставте код, побачте колір і скопіюйте будь-який формат одним клацанням.

Приклади:

Результати конвертації

CMYK тут – спрощена конвертація без ICC-профілю. Для друку попросіть у типографії конвертацію з урахуванням профілю.

Як користуватися конвертером кольорів

  1. Введіть або вставте колір у поле Вхідні дані. Формат визначається автоматично: #FF6347, FF6347, rgb(255 99 71), 255, 99, 71, hsl(9 100% 64%), hsv(9, 72%, 100%), cmyk(0, 61, 72, 0), lab(63% 59 48), oklch(70% 0.2 32) або назва на кшталт tomato.
  2. Результати з’являються під час введення. Також можна натиснути Enter або кнопку Конвертувати.
  3. Подивіться на зразок: він показує колір і Визначений формат, тож ви знаєте, як було прочитано ваші дані.
  4. Натисніть Копіювати біля потрібного формату. Кнопки прикладів допоможуть спробувати типові значення.

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

Підтримувані формати

Формат Приклад Типове застосування
HEX #FF6347 HTML, CSS, дизайнерські інструменти
RGB rgb(255, 99, 71) CSS, код, графічні редактори
HSL hsl(9, 100%, 64%) CSS, зміна світлості
HSV / HSB hsv(9, 72%, 100%) Photoshop, Figma, палітри
HWB hwb(9 28% 0%) CSS Color 4
CMYK cmyk(0%, 61%, 72%, 0%) друк (див. примітку нижче)
LAB (D50) lab(62.99% 59.36 47.88) CSS lab(), наука про колір
LCH lch(62.99% 76.27 38.89) CSS lch()
OKLCH oklch(69.62% 0.1955 32.32) сучасний CSS, дизайн-системи

Результати HEX, RGB, HSL, HWB, LAB, LCH і OKLCH – це коректний CSS, який можна вставляти просто в таблицю стилів. HSV і CMYK не є записами CSS, тому їх подано в загальноприйнятому функціональному стилі для читання.

Якщо у вхідних даних є прозорість (наприклад rgb(255 0 0 / 50%)), конвертер її зберігає: HEX стає вісімсимвольним кодом на кшталт #FF000080, а інші формати отримують значення альфа.

Як працює конвертація

RGB, HEX, HSL, HSV і HWB – це різні способи запису одних і тих самих значень sRGB, тому вони конвертуються точно (з точністю до округлення). LAB і LCH дотримуються визначення CSS Color 4, яке використовує білу точку D50 з хроматичною адаптацією Бредфорда. Деякі онлайн-конвертери застосовують D65, тому їхні числа LAB для того самого кольору можуть відрізнятися на кілька одиниць. OKLCH використовує модель Oklab Б’єрна Оттоссона, яку браузери застосовують для oklch().

Коли ви вводите колір LAB, LCH або OKLCH, надто насичений для звичайного екрана, він лежить поза гамою sRGB і не має відповідника в HEX. Тоді інструмент показує повідомлення й замінює його найближчим кольором, який можна відобразити, зменшуючи насиченість і зберігаючи світлість та відтінок.

CMYK – це наближення

Значення CMYK обчислюються за спрощеною формулою K = 1 − max(R, G, B) і C = (1 − R − K) / (1 − K), так само для M і Y. ICC-профіль не використовується, тому ці числа не передбачають, що надрукує конкретний верстат. Для професійного друку конвертуйте у своїй верстальній програмі з профілем, наданим типографією (наприклад FOGRA39 чи GRACoL). Зворотна конвертація CMYK в RGB використовує обернену формулу R = (1 − C)(1 − K).

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

Як вручну конвертувати HEX в RGB?

Розбийте код на три пари й переведіть кожну із шістнадцяткової системи в десяткову. Для #FF6347: FF = 255, 63 = 99, 47 = 71, тож колір – rgb(255, 99, 71).

Чим відрізняються HSL і HSV?

Обидві моделі використовують кут відтінку й насиченість, але третє значення HSL – це світлість (50 % – чистий колір, 100 % – білий), а HSV – значення, або яскравість (100 % – чистий колір або білий залежно від насиченості). Тому той самий колір має різні числа насиченості в кожній моделі.

Чому моє значення LAB відрізняється від іншого конвертера?

Найімовірніше, через білу точку. Цей інструмент використовує D50, як і CSS lab(). Конвертери на основі D65 дають трохи інші числа. Обидва результати правильні у власній системі відліку.

Чи можна конвертувати CMYK в HEX?

Так. Введіть щось на кшталт cmyk(0%, 61%, 72%, 0%) або cmyk(0, 0.61, 0.72, 0). Пам’ятайте, що результат – наближення без колірного профілю.

Чи приймає інструмент кольори без знака #?

Так. ff6347, f64 і навіть три числа через кому, як-от 255, 99, 71, розпізнаються.