Инструменты для цвета

Генератор CSS-градиентов онлайн — бесплатно

Бесплатно, без регистрации, работает в браузере. Создайте линейный, радиальный или конический градиент с количеством цветовых точек до 8, смотрите результат вживую и копируйте CSS. Скачайте его как фон в PNG в популярных размерах.

Тип

Опорные цвета

CSS

background: #ff7ac6;
background: linear-gradient(135deg, #ff7ac6 0%, #ffe14d 100%);

Первая строка — сплошной цвет для очень старых устройств, которые не показывают градиенты.

Начните с готового варианта

Создаётся на вашем устройстве.

Почему стоит выбрать Генератор CSS-градиентов

100% бесплатно
Пользуйтесь сколько угодно. Без регистрации, без водяных знаков, без установки.
Конфиденциально по умолчанию
Всё, что вы вводите, остаётся в браузере и никогда не отправляется нам.
Работает на любом устройстве
Работает в браузере на Windows, Mac, Linux, Android и iPhone. Приложение не нужно.

Как пользоваться: Генератор CSS-градиентов

  1. Выберите линейный, радиальный или конический тип и задайте направление.
  2. Выберите цвета и перетащите каждую точку на место.
  3. Скопируйте CSS или скачайте градиент как изображение.

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

Как использовать CSS?
Вставьте его в правило для нужного элемента. Первая строка — сплошной цвет на случай, если градиент не поддерживается; вторая — сам градиент.
Чем отличаются линейный, радиальный и конический?
Линейный переходит вдоль прямой, радиальный расходится от центра, а конический закручивается вокруг центра, как цветовой круг.
Можно использовать прозрачность?
Да. Введите в точку цвет вроде rgba(47, 91, 255, 0.5).
Что-нибудь загружается на сервер?
Нет. Градиенты создаются на вашем устройстве.
Генератор CSS-градиентов — это бесплатно?
Да. Пользоваться можно бесплатно, без регистрации и без установки.

Справка и руководства (на английском)

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