Генератор CSS-градиентов
Создавайте линейные, радиальные и конические CSS-градиенты с несколькими цветовыми точками и копируйте код.
background: —;
Всё выполняется в вашем браузере — без загрузки и регистрации.
О Генератор CSS-градиентов
Генератор CSS-градиентов создаёт линейные, радиальные и конические градиенты с полным визуальным контролем. Добавляйте цветовые точки кликом по полосе градиента, перетаскивайте их для смены позиции и задавайте каждой точке собственный цвет, прозрачность и положение. Линейные градиенты получают управление углом; радиальные — форму (круг или эллипс) и позицию; конические — начальный угол.
Живое превью показывает именно то, что отрендерит браузер, а кнопка случайной генерации и набор подобранных пресетов пригодятся, когда нужна отправная точка, а не пустой холст. Точки можно свободно добавлять и удалять — градиенту нужно как минимум две.
Когда результат выглядит правильно, скопируйте само значение градиента или полное CSS-правило. Генератор полностью работает в браузере, без загрузки на сервер и без регистрации, что делает его удобным спутником для кнопок, фонов hero-блоков, границ и текстовых эффектов.
Как использовать Генератор CSS-градиентов
- Выберите тип градиента: линейный, радиальный или конический.
- Задайте угол (для линейного), форму и позицию (для радиального) или начальный угол (для конического).
- Кликните по полосе градиента, чтобы добавить цветовые точки, и перетащите их в нужное положение.
- Задайте каждой точке цвет, прозрачность и точную позицию.
- Попробуйте пресеты или кнопку случайной генерации для быстрого вдохновения.
- Скопируйте значение градиента или полное CSS-правило.