Geliştirici araçları

CSS Metin Gölgesi Oluşturucu

Yatay ve dikey kaydırma, bulanıklık yarıçapı ve renk değerlerini ayarlayarak CSS text-shadow bildirimi üretin.

Aracı çalıştır

CSS metin gölgesi oluşturucu, web projelerinizdeki başlık ve tipografi öğelerine derinlik, vurgu ve görsel kontrast kazandırmak için geçerli `text-shadow` kodları üretir. Araç; yatay kaydırma, dikey kaydırma, bulanıklık yarıçapı ve renk parametrelerinden gelen değerleri alır ve doğrudan stil şablonlarınıza ekleyebileceğiniz standart bir CSS bildirimi oluşturur. Form alanlarına değer girilmediğinde araç birer piksellik yatay ve dikey kaydırma, iki piksellik bulanıklık ve yarı saydam siyah renk (#00000033) varsayılanlarını atar. Negatif değerler girerek gölgenizi sol veya yukarı yönde konumlandırabilir, sıfır piksel bulanıklık değeriyle sert hatlara sahip keskin gölgeler elde edebilirsiniz. Renk giriş kutusu standart metin formatlarını kabul eder. Sayısal parametrelere otomatik olarak piksel (px) birimi eklenir ve üretilen bildirim satır sonu noktalı virgülüyle birlikte çıktı kutusunda gösterilir. Kodunuzu kopyalayıp web tasarımınızın ilgili stil sınıfına yapıştırarak hızlıca uygulayabilirsiniz. Bu sayede metinlerinizi farklı arka planlar üzerinde kolayca öne çıkarabilirsiniz.

Kullanım

  1. Yatay kaydırma (Offset X) kutusuna gölgenin sağa veya sola ne kadar kayacağını belirten sayıyı girin.
  2. Dikey kaydırma (Offset Y) kutusuna gölgenin aşağı veya yukarı yöndeki mesafesini yazın.
  3. Bulanıklık (Blur) alanına piksel cinsinden istediğiniz yayılma değerini girin.
  4. Renk (Color) alanına HEX, RGBA veya geçerli bir renk adı yazın.
  5. Oluşturulan text-shadow satırını kopyalayarak CSS dosyanıza veya stil etiketinize ekleyin.

Örnekler

  • Yatay kaydırma 2, dikey kaydırma 2, bulanıklık 4 ve renk #000000 girildiğinde çıktı: text-shadow: 2px 2px 4px #000000;
  • Yatay kaydırma -1, dikey kaydırma -1, bulanıklık 0 ve renk rgba(0,0,0,0.5) girildiğinde çıktı: text-shadow: -1px -1px 0px rgba(0,0,0,0.5);

SSS

Parametre alanlarını boş bırakırsam ne olur?

Alanlar boş bırakılırsa araç şu varsayılanları kullanır: yatay kaydırma 1px, dikey kaydırma 1px, bulanıklık 2px ve renk #00000033.

Kaydırma ve bulanıklık alanlarına 0 değeri verebilir miyim?

Evet, kaydırma ve bulanıklık değerleri için 0 sayısı girilebilir. Örneğin bulanıklığı 0 yaptığınızda sert kenarlı bir gölge oluşur.

Hangi renk formatlarını kullanabilirim?

Renk kutusu metin girişi kabul eder; HEX (#ff0000), RGBA (rgba(0,0,0,0.4)) veya standart renk isimlerini yazabilirsiniz.

Bu aracı sitenize ekleyin

Aşağıdaki kodla çalışan SmartPlusLab aracını web sitenize ekleyin.