CSS Box Shadow Oluşturucu

Canlı önizleme, inset seçeneği ve hassas kontrollerle çok katmanlı CSS box-shadow değerleri oluşturun.

Katmanlar1
Canlı önizleme, inset seçeneği ve hassas kontrollerle çok katmanlı CSS box-shadow değerleri oluşturun.
Katman ayarları
Katman 1
px
px
px
px
Önizleme
box-shadow değerini CSS'inize kopyalayın.
box-shadow
CSS çıktısı
box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.2);

box-shadow nedir?

Canlı önizleme, inset seçeneği ve hassas kontrollerle çok katmanlı CSS box-shadow değerleri oluşturun.

box-shadow, bir öğenin arkasına (veya içine) bir ya da daha fazla gölge çizen bir CSS özelliğidir.

Her gölge yatay ve dikey kaydırma, bulanıklık yarıçapı, isteğe bağlı yayılma ve alfa içeren bir renkten oluşur; inset eklemek iç gölge yapar.

Birden çok katman virgülle ayrılır; bu sayede derinlik, parlama veya keskin kenarlar için gölgeler üst üste konur.

  • Yumuşak yükselti için küçük kaydırma ve daha fazla bulanıklık kullanın.
  • Daha keskin kenarlar için yüksek opaklık ve düşük bulanıklık kullanın.
  • Derinlik için dış gölgeyi iç gölgeyle birleştirin.
  • Performans için katman sayısını sınırlayın.