CSS Box-Shadow & Border-Radius Oluşturucu
Tasarım & GörselKutu gölgesi (X, Y, blur, spread, inset) ve köşe yuvarlama (border-radius) değerlerini canlı görsel arayüzle ayarlayın.
Canlı Kutu ve Gölge Simülasyonu
Arka Plan:
Önizleme Kutusu
24pxGölge Parametreleri
Yatay Uzaklık (X)0px
Dikey Uzaklık (Y)10px
Bulanıklık (Blur)25px
Yayılma (Spread)-5px
Opaklık%30
Köşe Yuvarlama & Kutu Rengi
Tüm Köşeler24px
Kullanıma Hazır CSS Kodu
box-shadow: 0px 10px 25px -5px rgba(0, 0, 0, 0.30);
border-radius: 24px;
background-color: #FFFFFF;
CSS Box-Shadow & Border-Radius Oluşturucu Nasıl Kullanılır?
1
Gölge Parametrelerini Ayarlayın
X, Y uzaklık, blur, spread ve opaklık değerlerini sürgülerle belirleyin.
2
Köşe Yuvarlamayı Seçin
Tek sürgüyle veya 4 köşeyi ayrı ayrı ayarlayarak border-radius verin.
3
Kodu Kopyalayın
Oluşturulan tam CSS bloklarını kopyalayıp stil dosyanıza ekleyin.
Gizlilik Güvencesi:Bu araçtaki tüm hesaplamalar ve dönüştürme işlemleri %100 istemci taraflı (JavaScript) olarak tarayıcınızda gerçekleştirilir. Verileriniz hiçbir sunucuya yüklenmez veya kaydedilmez.