Box Shadow
CSS box-shadow degerlerini gorsel kontrollerle ayarlayin. Coklu golge katmani, inset golge ve canli onizleme destegi vardir. Uretilen CSS kodunu tek tikla kopyalayin.
Öne çıkan özellikler
- Sezgisel yatay ve dikey ofset denetimleri
- Bulanıklık ve yayılma yarıçapı kaydırıcıları
- Hem iç (inset) hem de dış gölge desteği
- Gerekli tüm biçimlendirme ile tam CSS kodunu kopyalama
Guide
CSS box-shadow, dokümantasyonda basit görünen ama spesifik bir şey oluşturmaya çalıştığında zorlaşan özelliklerden biri. Ne kadar blur doğal gösterir? Hangi spread değeri sıkı kenarlık efekti verir, hangisi yumuşak parıltı? Gölge içe mi dışa mı olmalı? Kodunda kör kör sayıları değiştirip sayfayı yenileyip durmak kimsenin eğlence anlayışı değil. WebRecast'in ücretsiz kutu gölge üretici her parametre için görsel kontroller sunuyor. Yatay ve dikey kaydırmaları sürükleyerek gölgeyi konumlandır. Yumuşaklık için blur yarıçapını, boyut için spread'i ayarla. İstediğin gölge rengini seç, opaklığını ayarla ve dış ile inset gölge arasında geçiş yap. Her kaydırıcıyı sürükledikçe sonucun canlı güncelleniyor, tam istediğin efekti tutturmayı kolaylaştırıyor. Görünümden memnun kaldığında düzgün biçimlendirilmiş ve stil dosyana yapıştırmaya hazır CSS kodunu kopyala. Araç birden fazla gölge katmanlama desteği de sunuyor - modern kart tasarımlarında gördüğün o zengin, gerçekçi derinlik efektlerini böyle oluşturursun. CSSmatic'in box shadow aracını, Box-Shadow.dev'i veya Neumorphism.io'yu kullandıysan konsepti biliyorsun. Bu kutu gölge üretici tüm kontrolleri tek temiz arayüzde topluyor. Pratik bir tüyo: kart elemanları için yaklaşık 10-20px blur, düşük spread ve yarı saydam siyah ya da griden oluşan ince bir gölge kullan. Kartı sayfadan dramatik görünmeden kaldırır. Butonlar için 4-8px blur'lı daha küçük bir gölge güzel bir tıklanabilir his yaratıyor. Bu ücretsiz online kutu gölge aracı kuracak bir şey olmadan tarayıcında çalışıyor. Gölgeni tasarla, CSS'i kopyala, projene yapıştır. Görsel, hızlı ve tamamen ücretsiz.
Sık sorulan sorular
Birden fazla gölgeyi katmanlayabilir miyim?
Evet! Birden fazla gölge katmanı tanımlamanıza izin veririm ve bunları tek bir CSS dizesi olarak biçimlendiririm.
text-shadow için de çalışıyor mu?
Bu araç box-shadow'a odaklanır. Benzer değerleri CSS'inizdeki text-shadow için uygulayabilirsiniz.
