Конструктор градиентов
Создавайте эффектные CSS-градиенты с интерактивными остановками цвета, 18 пресетами и экспортом в Tailwind, SVG и CSS-анимации.
Кликните, чтобы добавить остановку · Перетащите для смещения
Экспорт
Тип градиента
Цветовые остановки
Пресеты
Импорт из CSS
Как это работает
Выберите тип
Linear, radial или conic — каждый создаёт свой визуальный эффект.
Добавьте остановки
Кликайте по полосе градиента, чтобы добавить остановки, перетаскивайте для смещения, редактируйте цвет и прозрачность.
Настройте
Меняйте угол направления, форму и размер для radial, позицию центра и число остановок.
Экспортируйте
Копируйте готовый CSS, классы Tailwind или CSS-переменную. Скачивайте SVG или включайте анимацию.
Часто задаваемые вопросы
Похожие инструменты
Другие инструменты UIXColors, которые хорошо дополняют «Конструктор CSS-градиентов».
Конвертер цветов
Конвертируйте цвета между форматами HEX, RGB, HSL, OKLCH, OKLab, CMYK и именованными. Превью в реальном времени. Бесплатно для дизайнеров и фронтенд-разработчиков.
Извлечение палитры из изображения
Извлеките доминирующие цвета из любой картинки. Загрузите PNG, JPG или WebP — получите значения в HEX, RGB, OKLCH. Бесплатно для дизайнеров и брендов.
Извлечение стайл-гайда сайта
Извлеките полный стайл-гайд с любого URL: цвета, шрифты, логотипы, кнопки, дизайн-токены. Браузерная точность через настоящий Chromium. Бесплатно.