Online Tool Store Online Tool Store

Генератор Названий Цветовой Палитры

Вставьте список цветов и получите для каждого имя, ближайший цвет CSS, предупреждения о почти-дубликатах и контраст WCAG — экспорт в CSS или JSON.

Этот инструмент работает полностью в вашем браузере. Ваши файлы никогда не загружаются на сервер.

Инструмент браузера

Генератор Названий Цветовой Палитры

Как это работает

  1. Вставьте цвета — hex, rgb() или названия цветов CSS, по одному в строке или через запятую.
  2. Каждый получает имя: точное название цвета CSS при близком совпадении, иначе сгенерированное описание вроде «Насыщенный тёмно-синий».
  3. Проверьте предупреждения о почти одинаковых цветах и значения контраста, если будете использовать цвет как текст или фон.
  4. Экспортируйте всю палитру как CSS-переменные или JSON.

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

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

Нет. Color Palette Namer работает полностью в вашем браузере — ничего не отправляется на сервер.

Откуда берутся названия?

Из двух источников. Если цвет очень близок к одному из 148 стандартных ключевых слов цвета CSS (например, «forestgreen» или «royalblue» — проверено по спецификации CSS/SVG), используется это точное имя. Иначе описательное имя генерируется из тона, светлоты и насыщенности, например «Насыщенный тёмно-синий» — никогда не придуманное непроверяемое имя.

Что считается «почти-дубликатом» цвета?

Два цвета, достаточно близких в перцептивном цветовом пространстве (измеряется в CIE Lab, а не в сыром RGB), чтобы выглядеть почти одинаково рядом друг с другом — частая проблема, которую стоит заметить до публикации палитры с двумя неразличимыми образцами.

Что означают значения контраста?

Коэффициент контрастности WCAG 2 этого цвета относительно чистого белого и чистого чёрного, от 1:1 (нет контраста) до 21:1 (чёрный на белом). AA требует 4,5:1 для обычного текста или 3:1 для крупного текста; AAA требует 7:1 — полезно для проверки, безопасен ли цвет как текст или фон.

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

Да — по одному в строке или через запятую. Принимаются hex-коды, rgb()/rgba() и названия цветов CSS.

Насколько точен результат?

148 точных названий цветов CSS проверены по спецификации CSS Color Module / SVG. Расстояния между цветами используют стандартное преобразование sRGB в Lab, сверенное с опубликованными эталонными значениями. Описательные имена — это схема из чётких диапазонов тона/светлоты/насыщенности, а не догадка.

Могу ли я использовать названия для дизайн-токенов или гайдлайна?

Да — именно для этого он и создан: превращать палитру hex-кодов в понятные человеку названия, которые можно использовать в именах токенов, документации или гайдлайне вместо сырых hex-значений.

Как мы сравниваем

ФункцияOnline Tool StoreTheme & Color hex-поискПлатное дизайн-ПО
Именует всю палитру сразу, а не по одному цвету ✓ ✗ ✓
Отмечает почти-дубликаты цветов в одной палитре ✓ Неприменимо — только один цвет ✗
Контраст WCAG к белому и чёрному показан прямо в интерфейсе ✓ ✗ Обычно отдельный инструмент
Точное совпадение использует проверенное стандартное название цвета CSS ✓ ✓ Именование под конкретный бренд
Бесплатно, без регистрации ✓ ✓ Часто по подписке

Инструменты для поиска имени одного цвета созданы для проверки по одному образцу за раз. Этот создан для просмотра целой палитры — проверки почти-дубликатов и контраста как раз и находят проблемы до публикации палитры.

Похожие инструменты

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

Вставьте это на свой сайт — он останется бесплатным, и файлы по-прежнему остаются в браузере посетителя, а не у вас или у нас.