🛝Toolio
О нас Контакты

🎨 Генератор палитры цветов

Мгновенно создавайте красивые палитры из пяти цветов с использованием режимов гармонии, таких как Аналогичный, Комплементарный и Триадный — или извлекайте палитру напрямую из любого изображения или из слова настроения, такого как закат. Закрепите цвета, которые вам нравятся, и остальная часть палитры будет построена вокруг них, затем экспортируйте набор как список HEX, переменные CSS, конфигурацию Tailwind, JSON или токены Figma. Это полностью бесплатно и работает полностью в браузере без загрузок на сервер или входа в систему. Ищете бесплатную альтернативу Coolors? Версия Toolio полностью бесплатна и не требует регистрации.

Нажмите клавишу Spacebar, чтобы создать новую палитру.

Приватно по умолчанию. Этот инструмент работает полностью в браузере — ничего, что вы вводите, не загружается, и он работает офлайн.

Об инструменте

Этот инструмент создает палитры из пяти цветов тремя способами: генерация из четырех режимов гармонии (Случайный, Аналогичный, Комплементарный, Триадный); ввод слова настроения, например закат, океан или киберпанк, чтобы получить палитру в этом стиле; или извлечение пяти доминирующих цветов из любого выбранного изображения — изображение обрабатывается локально с помощью квантования методом медианного сечения, каждый результат — это цвет, который действительно встречается в изображении, и ничего не загружается. Закрепите отдельные образцы, чтобы сохранить их при повторной генерации; в режимах Аналогичный, Комплементарный и Триадный остальная часть палитры строится вокруг оттенка первого закрепленного образца. Скопируйте любой отдельный код HEX или экспортируйте всю палитру в нужном формате: простой список HEX, пользовательские свойства CSS, фрагмент цветов Tailwind, массив JSON или токены Figma. Все работает в браузере, поэтому никакие данные о цветах или изображениях никогда не покидают устройство — нет сервера, нет учетной записи. Каждый образец также показывает ближайший номер PANTONE Solid Coated (например, PANTONE 185 C), поэтому сгенерированная или полученная из изображения палитра может сразу перейти к процессу печати.

Как пользоваться

  1. Выберите режим гармонии — Случайный, Аналогичный, Комплементарный или Триадный — из раскрывающегося списка "Режим".
  2. Нажмите "Сгенерировать" (или пробел), чтобы создать новую палитру из пяти цветов.
  3. Нажмите значок замка на любом цветовом образце, чтобы сохранить этот цвет; остальные образцы будут созданы вокруг его оттенка (в режиме Случайный они остаются случайными).
  4. Нажмите Copy HEX на элементе, чтобы скопировать код HEX этого цвета в буфер обмена.
  5. Чтобы скопировать все пять цветов сразу в выбранном рядом формате экспорта для использования в дизайн-инструменте или коде, нажмите "Скопировать всё".
  6. Нажмите "Из изображения" и выберите фотографию — инструмент извлекает пять доминирующих цветов из нее, все локально.
  7. Выберите формат экспорта — список HEX, переменные CSS, Tailwind, JSON или токены Figma — и нажмите "Скопировать всё", чтобы перенести палитру в проект.
  8. Или введите слово настроения, например закат, океан или киберпанк, и нажмите "Из настроения", чтобы создать палитру в этом стиле.

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

Этот инструмент бесплатный?
Да, полностью бесплатный — без подписки, без аккаунта и без скрытых ограничений. Просто откройте страницу и начните генерировать палитры.
Вы загружаете мои данные цвета на сервер?
Нет. Весь инструмент работает в вашем браузере с использованием JavaScript. Ничто не отправляется на любой сервер — данные ваших палитр цветов остаются только в localStorage вашего браузера.
Работает ли Генератор палитры цветов оффлайн?
Да. После загрузки страницы инструмент полностью работает оффлайн. Нет внешних вызовов API или зависимостей от CDN.
В чем разница между режимами гармонии?
Случайный выбирает пять несвязанных оттенков. Аналогичный распределяет пять оттенков на 20° друг от друга в диапазоне 80° цветового колеса для спокойного, согласованного вида. Комплементарный помещает два образца рядом с базовым оттенком и три на противоположной стороне колеса (на 170°, 180° и 190°) для высокого контраста. Триадный размещает оттенки на 120° друг от друга: два образца рядом с базовым оттенком, два рядом с +120° и один на +240°. Насыщенность и светлота варьируются в умеренном диапазоне во всех режимах. Колесо — это цветовое колесо HSL, поэтому дополнительный цвет к красному — циан, а не зеленый.
Могу ли я сохранить цвет, который мне нравится, при повторной генерации остальных?
Да. Нажмите значок замка на любом цветовом образце, чтобы сохранить его. Закрепленные цветовые образцы пропускаются при генерации. В режимах "Аналогичный", "Комплементарный" и "Триадный" остальные цветовые образцы строятся вокруг оттенка первого закрепленного цветового образца (серый цветовой образец не имеет оттенка и игнорируется в этом случае), поэтому палитра остается гармоничной вокруг любимого цвета; в режиме "Случайный" они остаются случайными. Палитра и закрепленные цвета сохраняются в этом браузере.
Можно ли создать палитру из изображения?
Да. Нажмите "Из изображения" и выберите фотографию. Инструмент уменьшает изображение, группирует похожие пиксели с использованием квантования медианного разреза и выбирает пять наиболее заметных групп, которые явно отличаются друг от друга. Каждый результат — это цвет, который действительно присутствует в изображении, а не среднее значение; результаты отсортированы от темных к светлым, и все это происходит в браузере — изображение никогда не загружается. Если в изображении меньше пяти различных цветов, например, плоский однотонный цвет, оставшиеся цветовые образцы — это более темные и светлые оттенки доминирующего цвета.
Какие форматы экспорта доступны?
Скопируйте палитру как простой список HEX, пользовательские свойства CSS (переменные :root), фрагмент цветов Tailwind, массив JSON или токены Figma (формат Tokens Studio). Выберите формат в раскрывающемся списке, затем нажмите "Скопировать всё" — готово к вставке в код или инструмент для дизайна.
Могу ли я увидеть номера Pantone для палитры?
Да. Каждый из пяти цветовых образцов показывает свой код HEX и ближайшее совпадение PANTONE Solid Coated (например, PANTONE 185 C); нажмите на метку Pantone, чтобы скопировать. Совпадения используют перцептуальную формулу CIEDE2000 и являются приблизительным ориентиром sRGB, поскольку цвета Pantone определяются физически, а не по значению экрана.
Как создать палитру из слова?
Да. Введите слово настроения, например, закат, океан, киберпанк или обангсэк (пять традиционных цветов Кореи) в поле настроения и нажмите "Из настроения". Известные слова настроения используют соответствующий оттенок, насыщенность и диапазон яркости, а обангсэк возвращает пять фиксированных традиционных цветов. Слова, которые инструмент не знает, все равно создают палитру, но их цвета не связаны со смыслом слова.
Загружает ли этот инструмент мои данные?
Нет. Всё выполняется прямо в вашем браузере, поэтому ваши данные никогда не покидают устройство — после загрузки страницы он работает даже офлайн.