Nasıl kullanılır?
- Örnek metin alanına kendi metninizi yazın. Önizleme gölgeyle birlikte metni gösterir, sonucu kendi kelimelerinizle değerlendirebilirsiniz.
- İlk katmanın Yatay kayma (px), Dikey kayma (px) ve Bulanıklık (px) değerlerini girin. Pozitif dikey kayma gölgeyi aşağı taşır.
- Her katman için Gölge rengi ve Saydamlık seçin; daha yumuşak bir parıltı için Katman ekle ile yeni katmanlar ekleyin.
- CSS tanımını kopyalayıp metninizin kuralına yapıştırın.
Değer nasıl oluşur?
text-shadow özelliği tek bir gölge ya da virgülle ayrılmış bir gölge listesi alır. Her gölgenin yatay ve dikey kaymaları ile yazılmayabilen bir bulanıklık yarıçapı ve bir renk vardır; renk uzunluklardan önce ya da sonra yazılabilir. CSS Text Decoration belirtimi sözdizimini verir. İlk gölge diğerlerinin üstüne çizilir; hiç gölge yoksa değer none olur.
Metin gölgesinin, kutu gölgesinin aksine yayılma değeri yoktur. Bulanıklık hiçbir zaman negatif olmaz; büyük bulanıklık gölgeyi daha geniş bir alana yayar. Saydamlık, rgba renginin alfa değeri olarak en fazla iki ondalıkla yazılır. Sıfır uzunluğun birime ihtiyacı yoktur; araç 0 yazar.
text-shadow: kayma-x kayma-y bulanıklık renk, kayma-x kayma-y bulanıklık renk, ...Katmanlar ve düzenleyicinin denetledikleri
Yumuşak bir parıltı çoğu zaman iki ya da üç katman kullanır: harflere yakın, küçük ve koyu bir gölge ile daha dışarıda, daha geniş ve açık bir gölge. Düzenleyici en çok 8 katman, -200 ile 200 piksel arasında kayma, 0 ile 100 piksel arasında bulanıklık ve yüzde 0 ile 100 arasında saydamlık kabul eder.
Önizleme renkleri, yani metin ve arka plan rengi, yalnızca önizleme içindir. CSS'in parçası değildir; bu yüzden tanım yalnızca gölgeyi verir.
Örnek: mavi bir parıltının altındaki siyah gölge
İlk katmanın kayması 0 ve 2 piksel, bulanıklığı 4 piksel ve rengi yüzde 30 saydamlıkta siyahtır. İkincisinin kayması yoktur, bulanıklığı 12 pikseldir ve yüzde 50 saydamlıkta #3b82f6 mavisidir.
Değer 0 2px 4px rgba(0, 0, 0, 0.3), 0 0 12px rgba(59, 130, 246, 0.5) olur; tanım ise text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3), 0 0 12px rgba(59, 130, 246, 0.5); şeklindedir.
Sık sorulan sorular
Bulanıklık ile ikinci katman arasındaki fark nedir?
Bulanıklık tek bir gölgenin kenarını yumuşatır, böylece gölge daha geniş bir alanda solar. İkinci katman ise kendi kayması, rengi ve saydamlığıyla ayrı bir gölge ekler ve birincisinden farklı bir yere çizilebilir.
Kaymaların neden işareti var?
Pozitif yatay kayma gölgeyi sağa, negatif olan sola taşır. Pozitif dikey kayma gölgeyi aşağı taşır; bu yüzden metnin altına düşen bir gölgenin değeri pozitiftir.
Metin gölgesinin yayılma değeri olabilir mi?
Hayır. text-shadow özelliği yalnızca kayma, bulanıklık ve renk alır. Kutu gölgesinin yayılması vardır, ama metnin yoktur; bu yüzden düzenleyici yayılma sunmaz.
Önizleme sayfamdakinden neden farklı görünüyor?
Önizleme, buraya yazdığınız örnek metni, boyutu ve renkleri kullanır. Sayfanızda gölge kendi yazı tipinize, boyutunuza ve arka planınıza düşer; bu yüzden bitirmeden önce sonucu yerinde kontrol edin.
Yazdığım bilgiler saklanıyor ya da bir sunucuya gönderiliyor mu?
Hayır. Örnek metin, önizleme ve CSS tarayıcınızda hazırlanır. Hiçbir şey saklanmaz ya da sunucumuza gönderilmez; bu yüzden sayfadan ayrılmadan önce tanımı kopyalayın.
Kaynaklar
Rakamlar ve metin en son 10 Kasım 2026 Salı tarihinde kontrol edildi.