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

Создавайте линейные, радиальные и конические CSS-градиенты визуально. Добавляйте несколько цветовых точек и копируйте готовый CSS-код. Предпросмотр обновляется в реальном времени.

CSS 

  




  


  
  

  
  
  
  

    
Возможности

    

      
      

        
        Linear / radial / conic
      

      
      

        
        Multiple color stops
      

      
      

        
        Angle / direction control
      

      
      

        
        Live preview & CSS code
      

      
    

  

  

  
  

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

    

      
        
        
1. Выберите тип градиента (линейный, радиальный, конический).

        
        
2. Нажмите «+» для добавления цветовых точек, перетаскивайте их для позиционирования.

        
        
3. Настройте угол или направление.

        
        
4. Скопируйте сгенерированный CSS-код.

        
      
    

  


  
  
  
  

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

    
    

      What types of gradients does CSS support?
      
CSS supports linear, radial, and conic gradients, each with different visual effects.

    

    
  

  

  
  
  

    
Похожие инструменты

    

      
      
        

          
        

        
Генератор CSS box-shadow

        
Визуально создавайте CSS-свойство box-shadow с помощью ползунков. Просматривайте...

      
      
      
        

          
        

        
Генератор CSS border-radius

        
Визуально настройте CSS border-radius — управляйте всеми четырьмя углами по отде...

      
      
      
        

          
        

        
CSS Flexbox-песочница

        
Изучайте и экспериментируйте с CSS Flexbox. Настраивайте свойства контейнера и н...

      
      
      
        

          
        

        
Генератор CSS Grid

        
Визуально создавайте CSS Grid-макеты. Задайте строки, столбцы, отступы и скопиру...