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 для перцептивно равномерного смешивания.

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

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

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

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

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

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

Генератор случайных цветовых палитр

Создавайте случайные палитры из 2–15 цветов, выбирайте яркий, пастельный, приглушенный или темный стиль и копируйте HEX-коды или CSS-переменные.

Конвертер BBCode в HTML

Преобразуйте BBCode (разметку форумов) в чистый HTML. Поддерживает теги форматирования, списки, цитаты, код, изображения, ссылки и таблицы.

Выбор цвета HEX

Выберите цвет визуально и получите значения HEX, RGB, HSL, HSV и CMYK, а также контраст на белом и чёрном фоне.

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

Создавайте монохромные, аналоговые, комплементарные, триадные или тетрадные палитры из базового HEX-цвета и экспортируйте готовые CSS-переменные.

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

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

Конвертер ASCII в Hex

Переводите ASCII text в hexadecimal byte values. Вывод использует две hex digits на символ и готов для memory dumps, packet traces или firmware tables.