Инструменты разработчика

CSS Color Names

Поиск именованных цветов по названию или HEX-значению с отображением HEX и RGB.

Запустить инструмент

CSS Color Names ищет цвета во встроенной коллекции именованных цветов. Введите полное название, его часть или шестизначное HEX-значение. Поле поиска необязательно: если оставить его пустым, коллекция обрабатывается без фильтра по названию или HEX-значению, в алфавитном порядке названий.

Поиск по названию и точному HEX-значению не зависит от регистра. Перед сопоставлением инструмент переводит запрос в нижний регистр и убирает пробелы по краям строки. Шестизначный HEX-код можно указывать как с начальным символом `#`, так и без него. Если непустой запрос не дает прямого совпадения, корректное шестизначное HEX-значение используется для поиска ближайшего именованного цвета по расстоянию между каналами RGB. Для каждого найденного элемента отображаются его имя, HEX-код в формате `#rrggbb` и три целых компонента RGB в диапазоне от 0 до 255. Некорректный запрос без совпадения по имени не выбирает ближайший цвет. Скопируйте полученные значения для стилей вашего проекта.

Инструкция

  1. Введите запрос в поле «Поиск».
  2. Для поиска по названию укажите полное название или его часть, например `navy`.
  3. Для поиска по HEX введите шестизначное значение с символом `#` или без него, например `#3a7bd5`.
  4. Оставьте поле пустым, чтобы просмотреть встроенную коллекцию без фильтра по названию или HEX-значению.
  5. Проверьте название, HEX-значение и три канала RGB в результате. Если прямого совпадения для корректного HEX-запроса нет, инструмент покажет ближайший цвет.

Примеры

  • Введите `navy`, чтобы найти цвет по названию и увидеть его HEX- и RGB-значения.
  • Введите `#3a7bd5` или `3a7bd5`, чтобы найти ближайший именованный цвет, если точного совпадения нет.

Частые вопросы

Можно ли искать цвет по названию?

Да. Введите полное название или его часть. Регистр букв и пробелы в начале и конце запроса не влияют на поиск.

Можно ли ввести HEX-значение?

Да. Введите шестизначное HEX-значение с символом `#` или без него. Регистр букв во вводе не важен: инструмент нормализует запрос перед сопоставлением. В результате HEX показывается в нижнем регистре, например `#000080`.

Что произойдет, если точного цвета нет?

Если прямого совпадения нет, инструмент проверяет запрос как шестизначное HEX-значение, предварительно убрав необязательный символ `#`. Для корректного значения он выбирает ближайший цвет по расстоянию между RGB-каналами.

Какие данные возвращаются?

В результате указаны название цвета, шестизначное HEX-значение в нижнем регистре с префиксом `#` и три целых значения RGB.

Встроить этот инструмент

Добавьте рабочий инструмент SmartPlusLab на свой сайт с помощью кода ниже.