Генератор градиентов
Визуально создавайте и просматривайте градиенты CSS.
Настройки градиента
Установите тип и направление градиента
Остановки цвета
Установите цвета и положения градиента
%
%
Предустановки
Попробуйте предопределенные градиенты
Предварительный просмотр
Просмотр сгенерированного градиента
Сгенерированный CSS
background: linear-gradient(90deg, #ff0000 0%, #0000ff 100%);Описание типа градиента
Линейный градиент
Градиент, который изменяет цвет в направлении прямой линии. Вы можете настроить угол, чтобы установить направление.
Радиальный градиент
Градиент, который изменяет цвет от центральной точки наружу в круглой или эллиптической форме.
Конический градиент
Конический градиент, который изменяет цвет при вращении вокруг центральной точки.