Генератор CSS Градієнтів
Створюйте безкоштовно красиві CSS градієнти онлайн. Проектуйте лінійні та радіальні градієнти з кількома кольоровими зупинками та копіюйте CSS код миттєво.
Preview
CSS Code
Як це працює
- Оберіть тип градієнта – лінійний або радіальний – залежно від потреб вашого дизайну.
- Додайте кольорові зупинки, клацнувши на смузі прокрутки та вибравши кольори з палітри кольорів.
- Налаштуйте кут або напрямок градієнта за допомогою елемента керування обертанням.
- Спостерігайте за результатом у реальному часі в області попереднього перегляду.
- Скопіюйте згенерований CSS-код одним кліком і вставте його безпосередньо у свій проект.
Приклад
Вхід: Лінійний градієнт: від #355C7D (0%) через #6C5B7B (50%) до #C06C84 (100%), кут 90°
Результат: background: linear-gradient(90deg, #355C7D 0%, #6C5B7B 50%, #C06C84 100%);
ЧПЗ
Так, абсолютно. Вся обробка відбувається безпосередньо у вашому браузері на стороні клієнта. Жодні дані не надсилаються на жодний сервер, тому ваша робота залишається повністю конфіденційною.
Так, ви можете додати будь-яку кількість кольорових зупинок, щоб створювати складні багатокольорові градієнти з плавними переходами між кожною зупинкою.
Згенерований код сумісний з усіма сучасними браузерами. Інструмент автоматично додає необхідні префікси постачальника для ширшої сумісності.
Ні, генератор CSS-градієнтів повністю безкоштовний і не потребує жодної реєстрації або входу в систему.
Лінійний градієнт переходить від одного кольору до іншого вздовж прямої лінії під визначеним кутом, тоді як радіальний поширюється від центральної точки назовні у круговій формі.