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

Создавайте линейные или радиальные градиенты до 4 цветов и копируйте готовый CSS код.

🔒 100% конфиденциально ⚡ Без загрузки файлов 🆓 Бесплатно и без ограничений

Как создать CSS-градиент онлайн

1

Выберите тип градиента

Выберите линейный или радиальный градиент в зависимости от желаемого эффекта.

2

Добавьте и отрегулируйте цвета

Добавьте до 4 цветов, измените их порядок и отрегулируйте угол или позицию градиента.

3

Скопируйте CSS код

Нажмите кнопку копирования и вставьте код прямо в вашу таблицу стилей.

Часто задаваемые вопросы о генераторе градиентов

Градиенты — простой способ добавить глубину и стиль любому веб-дизайну. Этот инструмент генерирует точный CSS код, который вам нужен, без необходимости писать его вручную.

Какие типы градиентов я могу создать?

+

Вы можете создавать линейные градиенты (под любым углом) и радиальные градиенты.

Сколько цветов я могу использовать?

+

Вы можете комбинировать от 2 до 4 цветов в одном градиенте.

Работает ли код во всех браузерах?

+

Да, градиент генерируется со стандартным синтаксисом CSS и совместим со всеми современными браузерами.

Нужно ли устанавливать какую-либо программу?

+

Нет, ничего устанавливать не нужно. Инструмент работает прямо в браузере.

Это бесплатно?

+

Да, этот инструмент полностью бесплатный.

Могу ли я использовать градиент как фон изображения?

+

Сгенерированный код — это чистый CSS; если вам нужно изображение, вы можете сделать снимок экрана предпросмотра.

Изучите цвета по семействам

Более 469 именованных цветов с кодами HEX, RGB, HSL и CMYK, организованные в 12 семейств оттенков.

Красные 50 Оранжевые 45 Коричневые 40 Жёлтые 40 Зелёные 55 Бирюзовые 35 Синие цвета 55 Фиолетовые 45 Розовые 45 Серые 35 Белые 15 Чёрные 9 Пастель 36