CSS Gradient генератор
Создайте линейные, радиальные и конические CSS-градиенты в вашем браузере.
Цветовые остановки
Используйте маркеры остановок или клавиши со стрелками для редактирования позиций. Каждая остановка включает явный цвет, непрозрачность и процент.
Локальная обработка в браузере
Ваш градиент остается в этом браузере. Никакие цвета или сгенерированный CSS не отправляются на Convertr.
Ограниченная импортная грамматика
Импорт принимает linear-gradient(), radial-gradient() или conic-gradient() с шестнадцатеричными цветами и процентами. Объявления, URL, переменные и неизвестные функции отклоняются локально.
Доступный запасной вариант
Сгенерированный CSS включает сплошной резервный фоновый цвет вместе с градиентом для неподдерживаемых рендеров и доступного интерфейса управления.
FAQ: конвертер файлов Convertr
Мой градиент загружен?
Нет. Состояние градиента, цвета, импортированный CSS и сгенерированный CSS остаются в вашем браузере.
Какие виды CSS-градиентов поддерживаются?
Генератор создает вывод linear-gradient(), radial-gradient() и conic-gradient() с несколькими шестнадцатеричными цветовыми остановками.
Что можно импортировать?
Импорт принимает намеренно ограниченную грамматику, используя одну поддерживаемую функцию градиента, шестнадцатеричные цвета, необязательные проценты и ограниченные значения угла или позиции.
Связанные инструменты для разработчиков и дизайна
CSS Gradient генератор
Создайте линейные или радиальные CSS-градиенты и просмотрите цветовые остановки, угол, положение и повторение.
- Ввод
- тип градиента, точки остановки цвета, позиции, угол и настройки повторения.
- Вывод
- предварительный просмотр и копируемое CSS-объявление фона.
- Реальные ограничения
- Рендеринг браузера может незначительно отличаться в зависимости от движка, и инструмент не оценивает контрастность и не гарантирует поддержку в устаревших браузерах.
- Конфиденциальность и обработка данных
- тип градиента, цветовые остановки, позиции, угол и настройки повторения обрабатываются в этой вкладке браузера. Convertr не получает и не хранит их; закрытие или перезагрузка страницы очищает рабочее состояние, если инструмент явно не предлагает локальную загрузку.
Как использовать этот инструмент
- Укажите тип градиента, цветовые остановки, позиции, угол и настройки повторения в элементах управления инструмента.
- Выберите настройки, влияющие на предварительный просмотр и копируемое объявление CSS-фона, затем запустите инструмент.
- Проверьте живой предпросмотр и копируемое CSS-объявление фона перед копированием или загрузкой.
Распространенные причины сбоев
Отсутствие точки остановки цвета, недействительный цвет или несовместимая позиция препятствуют созданию действительного CSS-объявления.
Полезный пример
Создайте 90-градусный линейный градиент от #111827 на 0% до #f59e0b на 100% и скопируйте объявление.