Softonic

Генератор градиентных обоев

Шаг 1 / 3
Далее

Мягкие трёхцветные градиенты с сильным размытием, это фоновый стиль почти каждой лендинговой страницы SaaS и большинства обоев для рабочего стола, выпущенных за последние четыре года. Этот инструмент смешивает три цвета в шестнадцатеричном формате с регулируемым углом и гауссовым размытием и экспортирует результат в разрешении для рабочего стола, телефона или фона Zoom.

Как создать градиентные обои

  1. 1

    Выберите три цвета

    Задайте шестнадцатеричные значения напрямую или нажмите «Случайно», чтобы получить неожиданную палитру.

  2. 2

    Задайте угол

    0–360°. 135°, это диагональ «заката», 90°, боковое смешение в стиле «рассвета».

  3. 3

    Настройте размытие

    Чем сильнее размытие, тем незаметнее границы между цветами и тем более гладким становится весь холст.

  4. 4

    Экспортируйте изображение

    Скачайте в разрешении, которое подходит вашему дисплею или телефону.

Рекомендуемые размеры вывода

Назначение Разрешение
Рабочий стол 4K 3840 × 2160
Рабочий стол 1440p 2560 × 1440
Рабочий стол 1080p 1920 × 1080
iPhone 15/16 1179 × 2556
Android (современный) 1080 × 2400
Виртуальный фон Zoom 1920 × 1080

Подсказки по палитре, которые всегда работают

  • Дополнительная пара + нейтральный: синий, оранжевый, бежевый.
  • Аналоговое трио: выберите три оттенка в пределах 60° на цветовом круге, фиолетовый, пурпурный, розовый.
  • Тепло-холодный контраст: один тёплый (персиковый, красный), один холодный (бирюзовый, тёмно-синий) и один нейтральный (кремовый).
  • Монохром: один оттенок в трёх значениях яркости создаёт сдержанную, цельную по настроению стену.

Почему размытие важно

Градиент из трёх точек без размытия показывает чёткие границы в точках смены цвета (так называемый «эффект радуги»). filter: blur() в 60–100 px на большом холсте сглаживает переходы в мягкие цветовые заливки, напоминающие обои macOS Big Sur или iOS 16.

Живой предпросмотр CSS

background: linear-gradient(135deg, #FF6B35, #7B2D26, #1E3A8A);
filter: blur(80px);

Если вы предпочитаете чёткий градиент без размытия, уменьшите значение фильтра до 0 и рассмотрите переход на интерполяцию in oklch для перцептивно равномерного смешивания.

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

Нет. Генератор рисует градиент на холсте большего размера, чем итоговое изображение, применяет размытие, а затем внутренне обрезает до целевого размера, поэтому пиксели по краям никогда не бывают прозрачными. Скачанные обои сохраняют чистые края при любой степени размытия.

Этот генератор использует три цвета. Чем больше цветов, тем сильнее изображение напоминает заставку; три, оптимальный выбор для спокойных обоев.

Не совсем. У телефона более вытянутые пропорции, чем у рабочего стола, поэтому диагональный угол воспринимается иначе. Просматривайте изображение в каждом целевом размере и корректируйте угол, если какой-то из вариантов выглядит неудачно.

Нет. Холст рисуется локально, и браузер покидает только та загрузка, которую вы запускаете сами.

Сопутствующие инструменты

Генератор вымышленных телефонных номеров

Создавайте до 50 вымышленных номеров из официально зарезервированных диапазонов пяти стран.

Генератор конфигурации webpack

Создайте webpack.config.js для webpack 5 под чистый JavaScript, React или Vue: TypeScript, Babel, CSS или Sass, изображения, HtmlWebpackPlugin, dev-сервер и команда npm install.

Генератор случайных букв

Генерируйте случайные буквы A-Z. Выберите количество, верхний или нижний регистр либо смешанный вариант для игр, заданий и уроков.

Валидатор XSD

Проверьте XML-документ в соответствии с схемой XSD и выявите несоответствия между элементами и их типами, указав точные номера строк.

Генератор случайных адресов

Создавайте 1–20 похожих на адрес записей для макетов и тестов в трёх упрощённых форматах.

Конвертер размера файлов

Преобразуйте значения между байтами, КБ, МБ, ГБ, ТБ и двоичными единицами IEC (KiB, MiB, GiB, TiB), свободно сочетая десятичные и двоичные единицы.

Инструмент доступен на других языках