Конвертер цветов

Что такое Конвертер цветов?

Color Converter — это бесплатный онлайн-конвертер цветов из HEX в RGB и HSL для разработчиков и дизайнеров. Введите цвет в любой нотации — HEX (#rrggbb или сокращённая форма #rgb), RGB (например, "255, 100, 0" или "rgb(255 100 0)") либо HSL (например, "220, 91%, 64%") — и каждый другой формат мгновенно обновится рядом с большим живым образцом предпросмотра. Встроенный выбор цвета позволяет подобрать оттенок визуально, а у каждого значения есть кнопка копирования в один клик, поэтому он удобен всякий раз, когда нужно согласовать фирменные цвета или перенести значения цвета CSS между кодом и инструментами дизайна.

Как пользоваться Конвертер цветов

1. Введите или вставьте цвет в поле HEX, RGB или HSL либо щёлкните образец выбора цвета, чтобы подобрать оттенок визуально.
2. Наблюдайте, как два других поля и большой образец предпросмотра мгновенно обновляются, отражая тот же цвет.
3. Прочитайте плитки сводки R / G / B, H / S / L и HEX ниже, чтобы увидеть преобразованные значения каналов.
4. Нажмите кнопку копирования рядом с полем, чтобы скопировать его значение: HEX копирует строку #rrggbb, а RGB и HSL копируют готовые к использованию строки rgb(...) и hsl(...).
5. Если значение отклонено, проверьте встроенную ошибку и введите его заново в формате, указанном в подсказке поля.

Примеры

#ff6400

RGB 255, 100, 0 / HSL 24, 100%, 50%

#fff

HEX #ffffff / RGB 255, 255, 255 / HSL 0, 0%, 100%

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

Какие цветовые форматы поддерживает этот конвертер?

Он преобразует между тремя форматами: HEX (полный #rrggbb и сокращённая форма #rgb), RGB (0-255 на канал) и HSL (тон в градусах, насыщенность и светлота в процентах). В настоящее время он не обрабатывает альфа/прозрачность, HSV, CMYK или именованные цвета CSS.

Почему мой цвет показывает ошибку "Invalid HEX color", "Invalid RGB color" или "Invalid HSL color"?

Значение не соответствует ожидаемому формату или выходит за пределы диапазона. HEX должен состоять из 3 или 6 шестнадцатеричных цифр, каналы RGB должны быть в диапазоне 0-255, а насыщенность и светлота HSL должны быть в диапазоне 0-100%. Введите его заново, следуя подсказке под этим полем.

Можно ли вставить полное значение CSS, например rgb(255 100 0)?

Да. Поля RGB и HSL просто извлекают числа из текста, поэтому и "255, 100, 0", и "rgb(255 100 0)" работают, а кнопки копирования выводят готовые к использованию строки rgb(...) и hsl(...).

Округляются ли преобразованные значения?

Да. Каналы RGB и значения HSL округляются до целых чисел, поэтому преобразование туда и обратно может отличаться от исходного на одну единицу. Вывод HEX всегда содержит две цифры на канал (#rrggbb).

Загружаются ли мои данные о цвете куда-либо?

Нет. Всё преобразование выполняется локально в вашем браузере с помощью JavaScript — ничего не отправляется на сервер и никакие значения цвета не загружаются, поэтому он работает приватно и даже офлайн после загрузки страницы.