Генератор CSS-градиентов
Соберите линейный или радиальный градиент, добавьте сколько угодно цветовых точек и мгновенно скопируйте CSS. Предпросмотр обновляется по мере правок цвета, позиций и угла.
Как пользоваться
Выберите линейный или радиальный тип, задайте угол (для линейного) и цвета с их позициями. Добавляйте точки для многоцветных градиентов — предпросмотр вживую.
Когда всё нравится — скопируйте строку background прямо в свой стиль. Это стандартный CSS, работающий во всех современных браузерах.
Частые вопросы
Какой CSS получается?
Стандартное свойство background: linear-gradient(...) или radial-gradient(...), которое можно вставить прямо в CSS.
Можно больше двух цветов?
Да — добавьте сколько угодно цветовых точек, у каждой своя позиция, для плавных многоцветных переходов.
Градиенты работают во всех браузерах?
Линейные и радиальные градиенты поддерживаются всеми современными браузерами без префиксов.
Можно задать направление?
Да — для линейного используйте ползунок угла (0–360°); радиальный расходится из центра.