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

Создавайте красивые тени визуально — перетаскивайте ползунки для смещения, размытия, растяжения, цвета и вставки. Накладывайте несколько слоёв и копируйте готовый CSS одним нажатием.

Слои
    Предпросмотр
    CSS-вывод
    
            
            
          
    
        
    
      
    
      
     Работает полностью в вашем браузере. Ничего не загружается.
    
    
    

    
    
      
    Как это работает
    
      
    
        
    STEP 1
    Настройте ползунки
    Отрегулируйте смещение X/Y, размытие, растяжение, прозрачность и цвет активного слоя тени. Предпросмотр обновляется в реальном времени.
    
        
    STEP 2
    Добавьте слои
    Нажмите «Добавить слой», чтобы наложить несколько теней. Выберите любой слой из списка для редактирования или удалите ненужные слои.
    
        
    STEP 3
    Скопируйте CSS
    Нажмите «Копировать CSS», чтобы скопировать полное объявление box-shadow. Вставьте его прямо в свою таблицу стилей.