Конвертер RGB в Hex

Перевод значений каналов red, green и blue в шестнадцатеричный код цвета.

Красный цвет (R):
Зеленый цвет (G):
Синий цвет (B):

Палитра в графическом редакторе выдает цвет rgb(46, 134, 171), а таблица стилей CSS оформлена шестнадцатеричными кодами. Смешивание двух разных форматов в одном файле усложняет чтение разметки и поддержку проекта.

Принцип перевода RGB в Hex код

Каждое из трех значений RGB от 0 до 255 переводится в двухзначную шестнадцатеричную пару чисел. Затем три пары объединяются после символа #. В примере rgb(46, 134, 171) число 46 превращается в 2E, 134 дает 86, а 171 становится AB. В итоге формируется код #2E86AB.

Ручной пересчет часто приводит к опечаткам на крайних числах диапазона. Например, 15 должно превращаться в 0F. Если потерять ведущий ноль, получится некорректная одиночная цифра вместо полной пары.

Примеры перевода значений RGB в Hex

Значение RGBПара HexПолный пример
000#000000 (black)
150Fa dark, easy-to-drop leading zero
8757#FF5733 (orange-red)
171AB#2E86AB (teal blue)
255FF#FFFFFF (white)

Формат RGBA и 8 цифр Hex с каналом прозрачности

Когда элементу требуется прозрачность, к каналам добавляется параметр альфа, например rgba(46, 134, 171, 0.5) для значения 50%. В шестнадцатеричной системе существует аналогичный формат из 8 знаков — #2E86AB80.

Два дополнительных символа на конце передают тот же уровень прозрачности по шкале от 0 до 255 (от 00 до FF), а не в процентах. Перед использованием убедись, что твоя сборка CSS или редактор поддерживают восьмизначный синтаксис.

Проверка контрастности после конвертации в Hex

  • Руководство WCAG требует минимальное соотношение контраста 4,5:1 между обычным текстом и фоном страницы.
  • Для крупного текста от 18pt или жирного от 14pt минимальная планка снижена до 3:1.
  • Светло-серый оттенок #AAAAAA на белом фоне полностью проваливает тест и создает трудности при чтении.
  • Перевод текста и фонового слоя в единый шестнадцатеричный вид помогает быстро проверить их сочетание на соответствие стандартам.

Вопросы о работе конвертера RGB в Hex

Как перевести число 171 из RGB в пару шестнадцатеричных символов?

Раздели 171 на 16: получается 10 с остатком 11. Число 10 в шестнадцатеричной записи обозначается буквой A, а 11 — буквой B, образуя пару AB. Инструмент выполняет эту операцию по нажатию кнопки.

Зачем нужны две последние цифры в восьмизначном Hex?

Они задают альфа-канал прозрачности по шкале каналов: FF означает полную непрозрачность, а 00 — абсолютную прозрачность.

Почему нельзя отбрасывать ведущий ноль?

Каждый канал строго кодируется двумя знаками. Если число 5 записать как 5 вместо 05, общая длина строки нарушится и цвета сдвинутся.

Какой порог контрастности обязателен для стандартного текста?

По стандарту WCAG AA для обычного текста требуется соотношение 4,5:1, а для крупного шрифта от 18pt или 14pt полужирного достаточно 3:1.

Что лучше использовать в стилях: rgba() или восьмизначный Hex?

Оба варианта поддерживаются браузерами. Запись rgba() более наглядна для чтения, а восьмизначный код компактнее. Выбирай вариант под стандарты своего проекта.

Cookie
Мы заботимся о ваших данных и хотели бы использовать файлы cookie, чтобы улучшить ваш опыт.