Генератор CSS-градиентов
Создавайте линейные, радиальные и конические CSS-градиенты визуально. Добавляйте несколько цветовых точек и копируйте готовый CSS-код. Предпросмотр обновляется в реальном времени.
Возможности
Как использовать
1. Выберите тип градиента и угол; рабочая область показывает предпросмотр в полный размер.
2. Тяните маркеры по дорожке, кликайте по свободному месту, чтобы добавить точку (до шести), или подстраивайте цветами и процентами.
3. Скопируйте готовый CSS — на шахматном фоне видно полосы на прозрачных участках.
Об этом инструменте
CSS-градиенты рисуют плавные переходы цвета без файлов изображений, поэтому остаются чёткими при любом размере и не требуют загрузки. Этот генератор создаёт все три встроенных типа: linear-gradient вдоль заданного угла, radial-gradient, расходящийся от центра, и conic-gradient, вращающийся вокруг точки, как цветовой круг. Перетаскивайте маркеры на шкале, чтобы сдвигать цветовые точки, щёлкните по шкале, чтобы добавить точку (до шести), и уточняйте цвета и позиции в полях. Сцена показывает результат в полный размер, а шахматный фон выявляет полосы и неожиданную прозрачность. На выходе — стандартный CSS, работающий во всех современных браузерах и готовый к вставке в свойство background или background-image.