CSS Araçları

Box Shadow Generator

Görsel arayüzle CSS box-shadow oluşturun, canlı önizleyin ve kodu kopyalayın.

Arka Plan Renkleri
Kutu:
Sayfa:
Gölge Katmanları
Katman 1
Yatay Offsetpx
Dikey Offsetpx
Bulanıklıkpx
Yayılmapx
Gölge Rengi
Opaklık%
CSS Kodu
box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.25);
Hazır Gölgeler
Hafif
Orta
Güçlü
Alt Ağırlıklı
Parlama
Katmanlı
Iç Gölge
Neon

Ne işe yarar?

CSS box-shadow özelliği, HTML elemanlarına gölge efektleri eklemenizi sağlar. Kartlar, butonlar ve paneller için derinlik hissi oluşturur. Bu araç ile görsel arayüz üzerinden gölge parametrelerini ayarlayabilir, birden fazla gölge katmanı ekleyebilir ve oluşan CSS kodunu anında kopyalayabilirsiniz.

Nasıl kullanılır?

Yatay/dikey offset, bulanıklık ve yayılma değerlerini kaydırıcılarla ayarlayın. Gölge rengini ve opaklığını seçin. Birden fazla gölge katmanı ekleyerek karmaşık efektler oluşturabilirsiniz. Hazır presetlerden birini seçerek hızlıca başlayabilirsiniz. Oluşan CSS kodunu "Kopyala" butonuyla panoya alın.