CSS Gradyan Oluşturucu

CSS gradyanı nasıl yapılır

1. Bir tür seç: doğrusal belirlediğin açıda düz bir çizgide ilerler, dairesel ortadan daire şeklinde yayılır, konik ise belirlediğin açıdan başlayıp ortanın etrafında döner.
2. Her rengi değiştir ve kaydırıcısını sürükleyerek konumunu %0 ile %100 arasında ayarla. Renk ekle en geniş boşluğa yenisini koyar, altıya kadar; ✕ birini kaldırır.
3. Ya da başlamak için bir hazır şablona bas. Önizleme anında değişir; CSS’i kopyala satırları stil dosyana yapıştırmak için kopyalar.

Sık sorulan sorular

Neden iki background satırı var?

İlki gradyan çizemeyen nadir tarayıcı için düz bir renktir; diğer her yerde ikinci satır onun yerine geçer.

Açı ne anlama geliyor?

Doğrusal gradyanda 0deg aşağıdan yukarı, 90deg soldan sağa, 180deg yukarıdan aşağı gider. Konikte ilk rengin başladığı yerdir, üstten saat yönünde sayılır.

Gradyanı yazıda ya da kenarlıkta kullanabilir miyim?

Evet. Yazı için arka plan olarak ver ve background-clip: text ile color: transparent ekle. Kenarlık için border-image içinde border-image-slice: 1 ile kullan.