Шестнадцатеричная запись sRGB без альфы
Цвет в вебе часто пишут как # и шесть цифр: две на красный, две на зелёный, две на синий. Каждая пара — байт 0…255. Раздел: веб и изображения.
Контроль: каналы 255, 0, 0 → #FF0000. Из #FF0000 красный 255. Из #00FF00 зелёный 255. Из короткого F00 синий 0.
Каналы — целые 0…255. Строка HEX — 3 или 6 шестнадцатеричных цифр, решётка необязательна. Родитель практика.
#RRGGBB и каналы
HEX = #RRGGBB
Четыре поля. Сборка: три канала → нормализованная строка с решёткой и шестью буквами A–F в верхнем регистре. Разбор: строка → один выбранный канал. Нужный канал выбираете целью расчёта.
Не HSL и не альфа
Не hsl(0 100% 50%) и не hsv. Не типографика. Не стороны кадра. Не разрешение снимка. Не процент как 50% серого: канал 128 — это байт, не поле процентов этой страницы. Именованные lime, rebeccapurple страница не знает.
Как пользоваться
Чтобы собрать HEX, введите R, G, B целыми. Чтобы вытащить канал, введите строку цвета и выберите R, G или B. Регистр букв a–f не важен. Пробелы вокруг строки обрежутся.
Примеры
1. Красный. 255, 0, 0 → #FF0000.
2. Красный канал. #FF0000 → 255.
3. Зелёный. #00FF00 → 255 у G.
4. Короткая запись. F00 → B = 0.
5. Запрет. текст not-a-color или R = 256.
Ещё задачи
Белый 255, 255, 255 → #FFFFFF. Чёрный 0, 0, 0 → #000000. Серый 128, 128, 128 → #808080, не #888, если не короткая запись 888 → #888888 (136, 136, 136) — это уже другой серый.
Синий чистый: #0000FF, B = 255. Не путайте с #00FF00 зелени.
Связь с отношением: канал/255 — доля, страница долю не печатает, только байт.
Тема тёмная #1A1A2E: разберите R, не гадайте «чуть синее». Три цели — три расчёта или один разбор с переключением цели.
Не кладите 16-битный канал 0…65535: это не веб-байт.
Вес PNG от выбранного HEX превью не считается.
CMYK типографии: другие оси. Сюда уже готовые RGB байты после конвертации в редакторе.
Не пишите rgb(255, 0, 0) в поле HEX — только цифры и необязательная решётка.
Два цвета градиента: два отдельных расчёта, страница не интерполирует.
Одна запись на выход: всегда # и шесть цифр, даже если ввели F00.
Шестнадцатеричные пары
Чертёж: три клетки R G B с числами 0…255 и строка из шести знаков под ними. FF = 15×16+15 = 255.
Памятка: пара цифр на канал, основание 16, без альфы.
Хаб веба ставит цвет рядом с rem, чтобы не склеить заливку и кегль.
Итог: байты 0…255, HEX 3 или 6 знаков, имена CSS вручную.
Короткая запись и именованные цвета
Правило CSS: #RGB удваивает каждую цифру. #0F8 → 00, FF, 88. Не «добавить нули справа» как 0F8000. Ошибка «три цифры как старшие» даёт другой цвет.
Имена navy, teal браузер знает таблицей. Эта страница таблицу не открывает: переведите имя в HEX справочником, затем вставьте цифры.
Родитель практика. Сосед по макету: корневой кегль.
Итог журнала: #RRGGBB ↔ (R, G, B), без A, без hsl.
Контроль: #FF0000 из 255 0 0. 255 из #FF0000. 0 синего из F00.
Пример: #336699 → R = 51, G = 102, B = 153. Короткая #369 — тот же цвет, потому что 33 66 99.
Не подставляйте LAB и P3: страница sRGB-байты как в классическом CSS hex.
Рабочий пример: G = 128 из #008000? Нет: #008000 это 0, 128, 0 — зелень «html green». Проверьте среднюю пару 80₁₆ = 128.
Связь с процентом: 50% яркости серого ≈ 128, не 50 в поле канала. 50 как байт — тёмно-тёмно-серый.
Итог для отчёта: три байта или одна строка, нормализация к # и шести цифрам.
Финальный якорь: 255,0,0 → #FF0000. Мусорная строка запрещена.
Добор: не называйте HEX «хэшем пароля» — здесь только цвет.
Ещё якорь: #FFFF00 жёлтый, R=255 G=255 B=0. Не оранжевый #FFA500 без расчёта A5.
Журнал: бренд #E63946. Красный 230, зелёный 57, синий 70. Не округляйте до #F00.
Не путайте с Мп: разрешение не цвет.
Финальный блок: sRGB байты, короткая тройка удваивается, без альфы, без имён.
Ещё контроль: #000000 → все нули. #FFFFFF → все 255. #0F0 → G = 255.
Почему верхний регистр на выходе? Одна каноническая форма проще сравнивать в отчёте. Вход допускает ff0000.
Итог абзаца: упаковка трёх байт в шесть hex-цифр и обратно.
Связь с кадром: заливка фона превью не меняет стороны.
Четыре цифры #RGBA в новых CSS: не поддерживается. Восемь цифр тоже нет.
Финальный добор: HEX и RGB 0…255, не HSL, не альфа, не rem, не Мп.
Отчёт: «красный» без 255,0,0 или #FF0000 не проверить.
Стык с отношением: R:G:B как 255:0:0 — другое представление, страница выдаёт байты по отдельности.
Не кладите 1920 в R.
Якорь: #FF0000; 255; G из #00FF00; B=0 из F00. 256 нельзя. Мусор нельзя.
Приложение: полупрозрачная кнопка в макете — альфу считайте отдельно в редакторе, сюда непрозрачный слой.
gamma и линейный свет: байты CSS обычно gamma-encoded sRGB. Страница не линеаризует для смешивания красок.
Повторный разбор после правки канала: соберите HEX заново, не редактируйте одну пару «на глаз» в середине строки, если не уверены в смещении.
Типичные ошибки
- Ждать hsl и имена CSS.
- Класть 256 в канал.
- Читать #RGB как старшие биты без удвоения.
- Вставлять rgb() в поле HEX.
- Восемь цифр альфы.
Соседи: px/rem, кадр, мегапиксели, отношение, проценты.
Дальтонизм и контраст WCAG страница не проверяет: только упаковка байт.
Итог добора: три канала 0…255 или HEX из 3/6 цифр, без прозрачности, без HSL, без именованных цветов.
Частые вопросы
- Что такое #FF0000 в каналах?
- R = 255, G = 0, B = 0. Обратно те же числа собирают #FF0000.
- Подойдёт ли F00 без решётки?
- Да. Три цифры удваиваются: F00 → FF0000, синий канал 0.
- Есть прозрачность?
- Нет. Восемь цифр #RRGGBBAA страница не разбирает. hsl() тоже нет.
- Канал 256?
- Ошибка. Байт цвета — целое от 0 до 255.
- Это кегль rem?
- px и rem про длину, не про цвет.
- Где хаб?
- Веб и изображения.
Источники
- Учебные определения: пропорции кадра, CSS rem от корневого кегля, t = размер/скорость, sRGB-каналы 0…255, мегапиксель = w·h/10⁶, дюйм печати = пиксели/DPI, объём = скорость×время.