Box shadow oluşturucu nasıl kullanılır
- 1
Başlangıç gölgesi seçin
Yumuşak, Katmanlı veya Yükseklik 2 gibi bir hazır ayara tıklayın ya da varsayılan katmanı düzenleyin.
- 2
Her katmanı şekillendirin
Bir katman seçin; X ve Y kaydırmasını, bulanıklığı, yayılmayı, rengi, opaklığı ve iç gölgeyi ayarlayın.
- 3
Kendi yüzeyinizde kontrol edin
Kutu boyutunu, köşe yarıçapını ve renkleri stil verdiğiniz öğeye uyacak şekilde değiştirin.
- 4
CSS'i kopyalayın
box-shadow bildirimini ya da Tailwind sınıfını kopyalayıp koduna yapıştırın.
Sınırlar ve Pro
Kayıt gerektirmeden ücretsiz: sınırsız katman, −100 ile 100 px arasında kaydırma, en fazla 200 px bulanıklık ve 12 gölge hazır ayarı.
Pro reklamları kaldırır; gölge düzenleyici her planda eksiksizdir. Pro'yu gör
Box shadow oluşturucu hakkında
CSS box-shadow özelliği, her biri yatay ve dikey kaydırma, bulanıklık yarıçapı, yayılma mesafesi, renk ve isteğe bağlı inset anahtar sözcüğünden oluşan bir katman listesi alır. Doğal görünen bir derinlik elde etmek için bu değerlerin iki ya da daha fazla katman arasında dengelenmesi gerekir; stil dosyasında sayıları elle değiştirerek bunu yapmak zordur. Bu düzenleyici, sürgüleri sürüklerken sonucu canlı bir önizleme kutusunda gösterir; bildirimi ve Tailwind shadow-[…] sınıfını sizin için yazar.
İstediğiniz kadar katman ekleyin, karşılaştırmak için birini geçici olarak gizleyin, yukarı ya da aşağı taşıyın (listedeki ilk katman en üstte çizilir) veya basılmış düğmeler ile giriş alanları için iç gölgeye çevirin. Kaydırma değerleri −100 ile 100 piksel arasında, bulanıklık en fazla 200 piksel, yayılma ise −100 ile 100 arasındadır; her rengin kendi opaklığı vardır. Negatif yayılma, modern yumuşak gölgelerin püf noktasıdır: gölgeyi öğenin altına doğru çeker, böylece altında yalnızca hafif bir parıltı görünür.
Önizleme kutusunun boyutunu değiştirebilir, istediğiniz köşe yarıçapını, kutu rengini ve arka plan rengini verebilirsiniz. Böylece gölgeyi tasarımınızın gerçek yüzeyinde, gölgelerin daha yüksek opaklığa ya da renkli bir parıltıya ihtiyaç duyduğu koyu temalar dahil, değerlendirebilirsiniz.
On iki başlangıç noktası hazırdır: dört Material Design yükseklik düzeyi, yumuşak tek katman, beş katmanlı pürüzsüz gölge, sert neubrutalist kaydırma, neumorphism, iç gölge, renkli parıltı, odak tarzı dış çizgi halkası ve yüzen kart. Gradyanlar diğer sekmededir; metin gölgeleri ve drop-shadow() filtresi kapsam dışındadır.
Gizlilik
Gölge tamamen bu sayfada oluşturulur ve önizlenir; katmanlarınız yalnızca bu tarayıcının yerel depolama alanına kaydedilir, böylece sayfayı yenileseniz de kaybolmaz. Hiçbir ayar ya da tasarım sunucuya gönderilmez.