CSS kutu gölgesi oluşturucu

Geliştirici yardımcı araçları

Kayma, bulanıklık, yayılma ve renk kaydırıcılarıyla kutu gölgeleri oluşturun ve CSS'i kopyalayın.

Nasıl kullanılır

Build a shadow

Move the sliders to adjust the horizontal offset, vertical offset, blur and spread. Choose a color and enable inset for an inner shadow.

Adjust the four sliders.
Pick a shadow color.
Copy the generated box-shadow declaration.

Negative values

Offsets and spread accept negative values, which move the shadow up or left and shrink it.

Sık sorulan sorular

What is spread?

Spread expands or contracts the shadow before it is blurred. Positive values make the shadow larger.

Why is my shadow translucent?

The generated color includes partial transparency so the shadow blends with the background. Replace the color value if you want it fully opaque.

İlgili araçlar

Kenar yuvarlama oluşturucu Her köşe için CSS border-radius değerlerini piksel veya yüzde olarak önizleyin ve kopyalayın. CSS gradyan oluşturucu Canlı önizleme ve kopyalanmaya hazır CSS ile doğrusal veya radyal CSS gradyanları tasarlayın. CSS Biçimlendirici Her satırda bir özellik ve tutarlı girinti ile CSS'i güzelleştirir. UUID / GUID Üretici Rastgele sürüm 4 UUID'ler üretir ve bunları tek tek veya toplu olarak kopyalar. Karma Üretici Herhangi bir metnin MD5, SHA-1, SHA-256 ve SHA-512 özetlerini hesaplar. Zaman Damgası Dönüştürücü Unix zaman damgaları, ISO 8601 ve okunabilir yerel tarihler arasında dönüştürür.