Генератор градиента из изображения
Создайте красивый градиент из любой фотографии — загрузите изображение, выберите настроение, и доминирующие цвета станут перетаскиваемыми точками градиента. Мгновенно скопируйте готовый CSS.
Перетащите изображение сюда
или нажмите для выбора — можно также вставить из буфера обмена
Всё работает в вашем браузере — изображение никуда не загружается, без регистрации, абсолютно бесплатно.
background: —;
О Генератор градиента из изображения
Генератор градиента из изображения превращает любую фотографию в готовый к использованию CSS-градиент. Перетащите, выберите через проводник или вставьте изображение — инструмент считывает его на холсте, извлекает доминирующие цвета и располагает их как точки градиента, которые можно перетаскивать, перекрашивать и переставлять, пока смешение не совпадёт с настроением оригинала.
Селектор настроения — Colorful, Bright, Muted, Deep или Dark — меняет, какие извлечённые цвета становятся точками, поэтому одна фотография может дать несколько совершенно разных градиентов. Вы управляете типом градиента (линейный, радиальный или конический), углом и самими точками: щёлкните по полосе, чтобы добавить точку, перетащите для перемещения, разверните или поверните одним щелчком.
Весь процесс выполняется в вашем браузере; изображение никогда не загружается на сервер. Когда превью выглядит правильно, скопируйте полное CSS-правило, только значение background или отдельно извлечённые цвета — идеально для героических секций, фонов страниц и фирменной визуальной айдентики на основе фотографий.
Как использовать Генератор градиента из изображения
- Перетащите изображение, выберите через проводник или вставьте из буфера обмена.
- Выберите настроение — Colorful, Bright, Muted, Deep или Dark, — чтобы определить, какие извлечённые цвета станут точками.
- Выберите тип градиента (линейный, радиальный или конический) и настройте угол.
- Перетащите цветовые точки для точной настройки смешения; добавляйте, удаляйте, разворачивайте или перемешивайте точки по необходимости.
- Нажмите «Копировать CSS», чтобы получить готовый к вставке код градиента.