Перевод цвета из hex в RGB онлайн

Q: Как перевести hex в RGB в JavaScript или Python?

JavaScript: [1, 3, 5].map((i) => parseInt(hex.slice(i, i + 2), 16)) для кода вида #RRGGBB . Python: tuple(int(h[i:i + 2], 16) for i in (1, 3, 5)) . В CSS переводить ничего не нужно — поддерживаются обе записи.

Введите hex-код цвета, например #7C3AED, и сразу получите его значения RGB. Подходят и короткие коды вроде #F80, и 8-значные коды с прозрачностью, и коды без # — или выберите цвет визуально.

#7C3AEDНажмите, чтобы выбрать цвет

Hex-код цвета

Значения RGB

Значение CSS rgb()

Все форматы цвета

HEX
RGB
RGBA
HSL
HSV
CMYK
Название в CSS

Как это вычисляется

Конфиденциально: ваши данные обрабатываются в браузере и никуда не загружаются.

Как перевести hex в RGB

Введите или вставьте hex-код цвета в поле Hex-код цвета — с # или без, либо нажмите на образец, чтобы выбрать цвет.
Получите результат в формате rgb() и посмотрите значения красного, зелёного и синего на ползунках, а также HSL, HSV и CMYK.
Копируйте любой формат одним нажатием. Формула рядом с форматами показывает, как каждая пара hex-цифр превращается в число от 0 до 255.

Формула перевода hex в RGB

Hex-код цвета — это три байта, записанные в шестнадцатеричной системе: #RRGGBB. Каждая пара цифр — один канал со значением от 00 (0) до FF (255). Чтобы перевести пару, умножьте первую цифру на 16 и прибавьте вторую, считая A = 10, B = 11, C = 12, D = 13, E = 14 и F = 15. Пример для #7C3AED:

Красный: 7C = 7 × 16 + 12 = 124
Зелёный: 3A = 3 × 16 + 10 = 58
Синий: ED = 14 × 16 + 13 = 237

Итак, #7C3AED = rgb(124, 58, 237).

Короткие hex-коды и коды с прозрачностью

Трёхзначный код — это сокращённая запись, в которой каждая цифра удваивается: #F80 = #FF8800 = rgb(255, 136, 0). Восьмизначный код добавляет байт альфа-канала для непрозрачности: в #7C3AED80 последняя пара 80 = 128, а 128 ÷ 255 ≈ 0.5, поэтому он равен rgba(124, 58, 237, 0.5). Четырёхзначная форма #RGBA работает так же.

Цвет	Hex	RGB
Белый	`#FFFFFF`	`rgb(255, 255, 255)`
Чёрный	`#000000`	`rgb(0, 0, 0)`
Красный	`#FF0000`	`rgb(255, 0, 0)`
Ярко-зелёный (lime)	`#00FF00`	`rgb(0, 255, 0)`
Синий	`#0000FF`	`rgb(0, 0, 255)`
Жёлтый	`#FFFF00`	`rgb(255, 255, 0)`
Оранжевый	`#FFA500`	`rgb(255, 165, 0)`
Серый	`#808080`	`rgb(128, 128, 128)`
Тёмно-синий (navy)	`#000080`	`rgb(0, 0, 128)`
Пурпурный (purple)	`#800080`	`rgb(128, 0, 128)`
Сине-зелёный (teal)	`#008080`	`rgb(0, 128, 128)`

Часто задаваемые вопросы

Как перевести hex в RGB вручную?

Разбейте код на три пары и переведите каждую из шестнадцатеричной системы: первая цифра × 16 + вторая цифра. Для #1E90FF: 1E = 30, 90 = 144 и FF = 255, значит, цвет — rgb(30, 144, 255).

Что означает трёхзначный hex-цвет вроде #F80?

Это сокращённая запись шестизначного кода, в которой каждая цифра удваивается: #F80 = #FF8800 = rgb(255, 136, 0). Сократить можно только те цвета, у которых в каждой паре две одинаковые цифры.

Как перевести hex в RGB в JavaScript или Python?

JavaScript: [1, 3, 5].map((i) => parseInt(hex.slice(i, i + 2), 16)) для кода вида #RRGGBB. Python: tuple(int(h[i:i + 2], 16) for i in (1, 3, 5)). В CSS переводить ничего не нужно — поддерживаются обе записи.

Что лучше для CSS: hex или RGB?

Они описывают абсолютно одинаковые цвета. Hex короче и привычен в программах для дизайна; rgb() проще читать и править, а с rgba() прозрачность видна сразу. Современные браузеры также понимают 8-значные hex-коды с альфа-каналом.