Toolzie

CSS Box Shadow Generator

Create beautiful box shadows visually and copy the CSS

CSS Code 

      

    


    
    

      

      

        
        
      

    

  








  

    
How to Use the CSS Box Shadow Generator

    
Adjust offset, blur, spread, color with sliders. Toggle inset. Add multiple. Live preview. Copy CSS.

    
Trial and error is tedious. Visually design shadows and get production CSS instantly.

  

  

    
Frequently Asked Questions

    

      
Multiple?

      
Yes, layer multiple with different values.

    

    

      
Blur vs spread?

      
Blur: soft edges; Spread: expand/contract shadow.

    

    

      
Inset?

      
Inner shadow inside element for pressed effect.

    

    

      
Browser support?

      
Yes, all modern browsers.

    

  











  

    Share:
    
      
    
    
      
    
    
      
    
    
  

  

    Helpful?