Допустимый ввод HSL
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°.
Преобразуйте HSL из задач «редактирование CSS-цветов по тону, насыщенности и светлоте» в тон, насыщенность и значение для работы с палитрами выбора для сценария «палитры выбора, вращение тона и графические элементы управления».
Значения преобразуются локальными TypeScript-функциями на странице; отправка цвета на сервер не нужна.
Выберите цвет визуально, настройте ползунки или вставьте значение.
Готовые цвета
hsv(9, 72%, 100%)
tomato
ПредпросмотрОригинал
rgb(255, 99, 71)
Осветлить на 20%
rgb(255, 130, 108)
Затемнить на 20%
rgb(204, 79, 57)
Комплементарная
rgb(71, 227, 255)
Aa
С белым текстом
Aa
С чёрным текстом
Другие форматы
Цветовая палитра
Знаете ли вы?
В браузере с EyeDropper API можно выбрать цвет прямо с экрана.
Преобразуйте HSL из задач «редактирование CSS-цветов по тону, насыщенности и светлоте» в тон, насыщенность и значение для работы с палитрами выбора для сценария «палитры выбора, вращение тона и графические элементы управления». Нормализация каналов и округление могут изменить значение после цикла HSL → HSV → HSL.
Преобразуйте HSL из задач «редактирование CSS-цветов по тону, насыщенности и светлоте» в тон, насыщенность и значение для работы с палитрами выбора для сценария «палитры выбора, вращение тона и графические элементы управления». Выбирайте этот маршрут, когда исходник уже в HSL, а следующей системе нужен именно HSV; для нескольких форматов используйте общий конвертер.
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°.
тон, насыщенность и значение для работы с палитрами выбора
Нормализация каналов и округление могут изменить значение после цикла HSL → HSV → HSL. Перед повторным использованием сравните результат с требованиями целевой системы.
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°. В разделе «Как пользоваться: Введите исходный цвет» это уточнение относится именно к «Конвертер HSL в HSV».
Используйте ползунки, поле, образцы или системную пипетку. Предпросмотр показывает нормализацию до формата HSV.
Скопируйте строку HSV. Остальные форматы доступны для сверки, но назначение страницы — HSL → HSV.
Нормализация каналов и округление могут изменить значение после цикла HSL → HSV → HSL. Перед повторным использованием сравните результат с требованиями целевой системы. Перед копированием HSV проверьте предпросмотр, чтобы заметить ошибку разбора.
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°. В разделе «Параметры и элементы управления: Допустимый ввод HSL» это уточнение относится именно к «Конвертер HSL в HSV».
тон, насыщенность и значение для работы с палитрами выбора. Value в HSV — максимальный канал RGB, а не воспринимаемая светлота; HSV не является отдельным синтаксисом CSS.
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°. Затем модуль приводит источник к sRGB и форматирует тон, насыщенность и значение для работы с палитрами выбора. HSL — преобразование RGB, а не перцептивно равномерная модель; его насыщенность отличается от HSV. Value в HSV — максимальный канал RGB, а не воспринимаемая светлота; HSV не является отдельным синтаксисом CSS.
Значения преобразуются локальными TypeScript-функциями на странице; отправка цвета на сервер не нужна.
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°. В разделе «Решение проблем: Почему ввод HSL отклонён?» это уточнение относится именно к «Конвертер HSL в HSV».
Нормализация каналов и округление могут изменить значение после цикла HSL → HSV → HSL. В разделе «Решение проблем: Почему после HSL → HSV → HSL значение меняется?» это уточнение относится именно к «Конвертер HSL в HSV».
Нормализация каналов и округление могут изменить значение после цикла HSL → HSV → HSL. Сбросьте инструмент и повторите с заведомо поддерживаемым значением, прежде чем считать это ошибкой алгоритма.
Выбирайте этот маршрут, когда исходник уже в HSL, а следующей системе нужен именно HSV; для нескольких форматов используйте общий конвертер. В разделе «Когда нужен отдельный конвертер HSL в HSV?» это уточнение относится именно к «Конвертер HSL в HSV».
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°. В разделе «Почему ввод HSL отклонён?» это уточнение относится именно к «Конвертер HSL в HSV».
Нормализация каналов и округление могут изменить значение после цикла HSL → HSV → HSL. В разделе «Почему после HSL → HSV → HSL значение меняется?» это уточнение относится именно к «Конвертер HSL в HSV».
тон, насыщенность и значение для работы с палитрами выбора. палитры выбора, вращение тона и графические элементы управления. Value в HSV — максимальный канал RGB, а не воспринимаемая светлота; HSV не является отдельным синтаксисом CSS.
Введите тон в градусах, а насыщенность и светлоту — в процентах. Тон циклически нормализуется в пределах 0–360°. HSL — преобразование RGB, а не перцептивно равномерная модель; его насыщенность отличается от HSV.
Значения преобразуются локальными TypeScript-функциями на странице; отправка цвета на сервер не нужна. Сохраняйте исходное значение HSL, чтобы сравнить его с округлённым HSV.
Выбирайте этот маршрут, когда исходник уже в HSL, а следующей системе нужен именно HSV; для нескольких форматов используйте общий конвертер. В разделе «Продолжить работу с цветом» это уточнение относится именно к «Конвертер HSL в HSV».
Откройте первый связанный инструмент, если работа продолжается после преобразования HSL → HSV.
Конвертер цветов HEX, RGB, HSL, LAB и OKLCH