Katmanlı CSS gölgelerini canlı önizlemeyle kurun, sonra düz CSS veya Tailwind değeri olarak kopyalayın.
box-shadow: 0px 10px 24px -4px rgba(13, 13, 18, 0.28);
shadow-[0px_10px_24px_-4px_rgba(13,_13,_18,_0.28)]
Temel olarak ince, kart, havada veya iç gölge seçin. Hazır ayarlar sıfırdan başlamaktan hızlıdır; kart ve havada seçenekleri zaten iki katman kullanır.
Yatay ve dikey kaymayı, bulanıklığı, yayılmayı, rengi ve saydamlığı ayarlayın. Derinlik için katman ekleyin: gerçek gölgeler genelde dar koyu bir katman artı geniş yumuşak bir katmandır.
Önizleme anında güncellenir. Stil dosyası için düz CSS bildirimini, utility odaklı bir projede çalışıyorsanız Tailwind değerini kopyalayın.
Sırasıyla yatay kayma, dikey kayma, bulanıklık yarıçapı ve yayılma. Kaymalar gölgeyi taşır, bulanıklık kenarını yumuşatır, yayılma ise bulanıklık uygulanmadan önce tüm şekli büyütür veya küçültür.
Gerçek gölgeler tek bir bulanıklık değildir. Ögeye yakın dar ve koyu bir katmanı, altına geniş ve yumuşak bir katmanla üst üste koymak gerçek derinlik hissi verir; kart ve havada ayarları bu yüzden iki katman kullanır.
Gölgeyi ögenin dışına değil içine çizer; giriş alanları, oyuklar ve anahtarlar için basılmış ya da içeri gömülmüş görünümü böyle elde edersiniz.
Bir sınıf olarak yapıştırın. Tailwind'in keyfi değer sözdizimini boşluk yerine alt çizgiyle kullanır; çünkü bir sınıf adı boşluk içeremez.
Evet ve gerçekten işe yarar. Negatif yayılma gölgeyi içeri çeker, böylece yalnızca alttan görünür; yumuşak ve yere basan kart gölgesinin olağan yöntemi budur.
Siyah bir gölgenin koyu zeminde neredeyse hiç kontrastı olmaz. Koyu yüzeylerde ya saydamlığı belirgin şekilde artırın ya da parıltı için düşük saydamlıkla daha açık bir gölge rengi kullanın.
Birkaç sabit gölge sorun değildir. Çok sayıda ögede çok büyük bulanıklık yarıçapları veya box shadow animasyonu yeniden çizim maliyeti yaratır; olağan çözüm sözde ögede saydamlığı canlandırmaktır.
Evet, tamamen ücretsiz; üyelik yok ve çıktıda filigran yok.
Tailwind çıktısı sunan CSS gradyan oluşturucu. Doğrusal ve radyal gradyanları görsel olarak tasarlayın, üretime hazır CSS veya Tailwind sınıflarını kopyalayın.
Aracı AçCanlı önizleme ve CSS çıktısı ile HEX, RGB ve HSL formatları arasında renk dönüştürün.
Aracı AçYükleme sınırı olmayan ücretsiz çevrimiçi görsel sıkıştırıcı. Ayarlanabilir kalite, yeniden boyutlandırma ve format dönüştürmeyle dosya boyutunu küçültün. Görseller cihazınızdan çıkmaz.
Aracı Aç