Белый цвет RGB код - это rgb(255, 255, 255), в HEX то же самое записывается как #FFFFFF. Вопрос кажется простым, но на практике путают то направление конвертации, то количество нулей в HEX, то забывают, что чёрный - это не «минус белый», а отдельное значение rgb(0, 0, 0). Ниже - калькулятор для перевода между форматами и таблица кодов основных цветов, которую удобно держать под рукой при вёрстке или дизайне.
Белый цвет: RGB код и HEX код
У белого все три канала - красный, зелёный, синий - выставлены на максимум:
- RGB: rgb(255, 255, 255)
- HEX: #FFFFFF
Логика простая. Экран собирает цвет из трёх источников света: красного, зелёного и синего. Если включить все три на полную мощность, глаз видит белый. Это работает иначе, чем смешение красок на бумаге, где сложение всех цветов даёт грязно-коричневый - на экране система аддитивная, а не субтрактивная.
Чёрный цвет: RGB код и HEX код
Чёрный - полная противоположность: все каналы на нуле.
- RGB: rgb(0, 0, 0)
- HEX: #000000
Ноль по всем трём каналам не значит «пусто» - это конкретный цвет, который пиксель показывает при отсутствии свечения. На OLED-экранах чёрный пиксель в буквальном смысле выключен, на LCD - подсветка перекрыта.
Таблица кодов основных цветов RGB и HEX
| Цвет | RGB | HEX |
|---|---|---|
| Белый | rgb(255, 255, 255) | #FFFFFF |
| Чёрный | rgb(0, 0, 0) | #000000 |
| Красный | rgb(255, 0, 0) | #FF0000 |
| Зелёный | rgb(0, 255, 0) | #00FF00 |
| Синий | rgb(0, 0, 255) | #0000FF |
| Жёлтый | rgb(255, 255, 0) | #FFFF00 |
| Голубой (cyan) | rgb(0, 255, 255) | #00FFFF |
| Пурпурный (magenta) | rgb(255, 0, 255) | #FF00FF |
| Серый | rgb(128, 128, 128) | #808080 |
Если нужного оттенка нет в таблице, введите свои значения в калькулятор выше - он переводит HEX в RGB и обратно сразу, без отдельной кнопки.
Как читать эти коды
В RGB каждое число от 0 до 255 показывает интенсивность одного канала: первое - красный, второе - зелёный, третье - синий. Всего 256 градаций на канал, потому что при 8-битной глубине цвета это ровно диапазон от 0 до 2 в восьмой степени минус один.
HEX-код - та же самая информация, только в шестнадцатеричной системе и без пробелов. #FF0000 разбивается на три пары: FF, 00, 00. Каждая пара - один канал, переведённый из десятичного числа в шестнадцатеричное. FF - это 255, 00 - это 0. Отсюда и красный: максимум красного канала, ноль зелёного и синего.
Принцип серого: равные каналы
Серый получается, когда все три канала равны между собой, а не когда они на нуле или на максимуме. rgb(128, 128, 128) - это средне-серый, ровно посередине шкалы. Чем ближе число к 255, тем светлее оттенок: rgb(200, 200, 200) уже близок к белому, rgb(40, 40, 40) - почти чёрный. Стоит нарушить равенство каналов - и серый превращается в цветной оттенок, пусть даже едва заметный.
Сокращённая запись HEX
Когда обе цифры в каждой паре совпадают, HEX можно сократить втрое: #FFFFFF превращается в #FFF, #000000 - в #000, #FF0000 - в #F00. Браузер разворачивает такую запись обратно, дублируя каждый символ. Работает это только при совпадающих цифрах в паре - #3366FF в #36F не сожмётся, потому что 33 и 36 не совпадают друг с другом.
Где пригодятся коды основных цветов
Вёрстка сайтов и CSS - самое частое место, где нужны точные HEX-коды: фон, текст, границы элементов задаются именно так. В графических редакторах вроде Photoshop или Figma переключение между RGB и HEX происходит постоянно, особенно когда дизайн передают разработчику текстом, а не файлом. Печать и полиграфия используют другие модели (CMYK), но исходные макеты чаще всего готовят в RGB, и код нужно знать заранее, чтобы понимать, как цвет будет выглядеть на экране до печати.