Конвертер HEX в RGB
Превратите hex-код цвета в значения RGB.
Работает в браузере. То, что вы вводите, никуда не отправляется.
- 3, 4, 6 или 8 цифр
- Также RGBA и HSL
- Копирование в один клик
Как конвертировать HEX в RGB
- Введите или вставьте hex-код, с решёткой # или без неё.
- Значения RGB, RGBA и HSL обновляются по мере ввода.
- Нажмите кнопку копирования рядом с нужным значением.
Примеры HEX в RGB
| Hex | RGB | Примечание |
|---|---|---|
| #FF8800 | rgb(255, 136, 0) | Стандартный 6-значный hex |
| #F80 | rgb(255, 136, 0) | 3-значная сокращённая запись, тот же цвет |
| #000000 | rgb(0, 0, 0) | Чёрный |
| #FFFFFF | rgb(255, 255, 255) | Белый |
| #FF880080 | rgba(255, 136, 0, 0.5) | 8-значный hex с альфа-каналом |
Сокращённая запись и её полная версия всегда декодируются в абсолютно одинаковый цвет, ведь каждая цифра сокращённой записи просто удваивается.
Откуда берутся hex-коды
Инструменты дизайна вроде Figma и Photoshop, а также DevTools любого браузера, по умолчанию показывают цвет в hex, потому что это самый короткий способ записать точный цвет текстом.
Hex является частью веба ещё со времён первых цветовых атрибутов HTML в 1990-х годах, задолго до появления функций CSS rgb() и hsl(). Именно поэтому большинство гайдов по стилю до сих пор начинают именно с hex.
Частые ошибки в hex-кодах
- Hex-код должен состоять из 3, 4, 6 или 8 цифр. Длина 5 или 7 недопустима и не конвертируется.
- Некоторые старые API Windows хранят цвета как BGR вместо RGB, поэтому в коде, скопированном из устаревшего кода, красный и синий могут быть переставлены местами.
- Последние две цифры 8-значного кода означают альфа-канал, а не четвёртый канал цвета, поэтому #FF880000 полностью прозрачный, а не более тёмный оранжевый.
Частые вопросы о HEX в RGB
Как перевести HEX в RGB вручную?
Разделите код на три пары и переведите каждую пару из шестнадцатеричной системы в десятичную. Для #F08A3C получится F0 = 240, 8A = 138 и 3C = 60, то есть rgb(240, 138, 60).
Что такое 3-значный hex-код?
Сокращённая запись, где каждая цифра удваивается. #F80 это тот же цвет, что и #FF8800, а #000 это чёрный.
Что означают последние две цифры 8-значного hex-кода?
Это альфа-канал, то есть непрозрачность. #FF880080 значит оранжевый цвет с непрозрачностью около 50%, то же самое, что rgba(255, 136, 0, 0.5).
Код должен начинаться с #?
Нет. Конвертер принимает коды с решёткой # и без неё, в верхнем и нижнем регистре.
Почему мой hex-код показывается как недопустимый?
Hex-код должен состоять ровно из 3, 4, 6 или 8 цифр, использующих 0-9 и A-F. Длина вроде 5 или 7 или символ вне этого диапазона не конвертируется.
Можно вставить переменную CSS вроде var(--brand)?
Нет, вставьте буквальное значение цвета. Сначала посмотрите, во что раскрывается переменная, например на панели вычисленных стилей в DevTools вашего браузера.
Какой самый короткий hex-код?
3 цифры, например #000 для чёрного или #fff для белого. Каждая цифра означает удвоенную пару в полном 6-значном значении.