Конвертер цветов

Конвертировать цвет между HEX, RGB, HSL, HSV, OKLCH и CMYK

Файлы не покидают устройство
Работает в браузере
Бесплатно, без регистрации и водяных знаков

#FF8000oklch(73.19% 0.1858 52.98)

Paste or type any color

Open color picker

Opacity: 100%

Nearest CSS name

darkorangeΔE 3.9

Formats

Modern CSS syntax

HEX

RGB

HSL

HSV / HSB

HWB

OKLCH

OKLab

CIE Lab

CIE LCH

CMYK

Display P3

Lab and LCH use the D50 white point, the same as CSS lab() and lch(). CMYK here is a plain formula without an ICC profile. Ask your printer for exact values.

Tints & shades

Click a swatch to copy its HEX. Mixed with white and black in OKLab, so steps look even.

Как пользоваться: Конвертер цветов

Конвертируйте цвет между HEX, RGB, HSL, HSV, HWB, OKLCH, OKLab, CIE Lab, CIE LCH, CMYK и Display P3. Правьте любой формат — остальные следуют за ним, с ближайшим именем цвета CSS и полосой оттенков и теней.

1
Введите или вставьте цвет в «Вставьте или введите любой цвет», например #ff8000, rgb(255 128 0), oklch(70% 0.19 50) или tomato.
2
Или используйте «Открыть палитру», «Взять с экрана» или «Случайный цвет», чтобы начать с образца.
3
Читайте или правьте значения в «Форматах»; изменение любого поля обновляет все остальные.
4
Задайте ползунок непрозрачности для прозрачности и включите «Современный синтаксис CSS» для значений через пробел вроде rgb(255 128 0 / 50%).
5
Нажмите значок копирования рядом с форматом или образец в «Оттенках и тенях», чтобы скопировать его HEX.

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

Почему сказано, что цвет вне sRGB?

OKLCH, Lab и Display P3 описывают цвета, которые большинство экранов не показывают. Форматы HEX, RGB, HSL и другие sRGB тогда показывают ближайший отображаемый цвет, сопоставленный способом CSS, чтобы сохранить светлоту и оттенок, а примечание говорит, что дало бы наивное обрезание.

Точны ли значения CMYK для печати?

Нет. CMYK здесь — простая формула без профиля ICC. Точные значения для их машины и бумаги спрашивайте у типографии.

Какую точку белого используют Lab и LCH?

D50, как у CSS lab() и lch(), поэтому значения можно вставлять прямо в таблицу стилей.

Почему я не вижу кнопку «Взять с экрана»?

Она использует EyeDropper API браузера, который есть в браузерах на Chromium, таких как Chrome и Edge. Где его нет, кнопка скрыта; используйте палитру или вставьте значение.

Сохраняет ли он что-нибудь?

Последний цвет и настройка «Современный синтаксис CSS» хранятся в локальном хранилище браузера, чтобы быть на месте в следующий раз. На сервер ничего не отправляется.