Дизайн

Генератор градиентов CSS

Визуально создавать CSS-градиенты.

Как использовать

Выберите пресет или создайте свой: добавляйте точки цвета, перетаскивайте позиции, переключайте линейный / радиальный / конический. Копируйте CSS или сниппет для Tailwind.

Вопросы и ответы

Какие типы градиента поддерживаются?

Линейный (под любым углом), радиальный (круг из центра) и конический (цветовой круг). Каждый поддерживает несколько цветовых точек с перетаскиваемыми позициями.

Как использовать CSS?

Скопируйте созданную строку background в таблицу стилей или вставьте её в произвольное значение Tailwind, например bg-[linear-gradient(...)].

Можно ли начать с пресета?

Да — выберите любой из 12 пресетов (закат, океан, радиальный прожектор, коническая радуга и другие), затем настройте цветовые точки и углы.

Последнее обновление: