yandex

CSS3 Filtre Efektleri

Bu içerik 2 sene önce dogukanbatal tarafından yazılmıştır.
Paylaş:

Merhaba arkadaşlar bu yazımda sizlere CSS3 filtre efektleri ni anlatıcağım.Bu efektler sayesinde Photoshopda resimlere uyguladığımız efektlerin çoğunu burda HTML elemanlarına uygulayabileceğiz.Kullanımları çok basit başlayalım hemen.

Kullanımları görmeden önce aşağıdaki bağlantıdan efektlerin uygulanmış hallerini görebilirsiniz.

 

CSS Filtre Efektleri | Demo

 

CSS3 Filtre Efektleri 

 

1)Bulanıklık (Blur)

Resimi bulanıklaştırmak için kullanılan efekt.

 

2)Grayscale

Siyah Beyaz için kullanılan efekt.

 

3)Sepia

Kahverengi ve Sarı renklerine doğru olan bir filtre.

 

4)Parlaklık (Brightness)

Çoğu yerde gördüğümüz Parlaklık filtresi.

 

5)Contrast

Resimin kontrast değeri düşük yüzdelerde örneğin %5 %0 gibi resim siyah olur yüzde yükseldikçe resim orjinal rengine döner.

 

6)Hue Rotate

0 360 arasında olan renk karışımıdır.0 kırmızı, 120 yeşil,240 mavi renktir.

 

7)Invert

Uygulanan elemanda renkleri ters çevirir.

 

8)Drop Shadow

Uygulanan elemana gölge veirir.Örnektekini incelerseniz resimin saydam kısımlarınada gölge uyguladığını görebilirsiniz.

 

9)Saturate

Sıcaklık efekti diyebilirsiz örneğin resime uygulandığında resim biraz daha koyu canlı gözüküyor.

 

10)Opacity

CSSde normal olarak kullansakta bu özelliği biliyorsunuzdur elemanın saydamlık değeri.

 

CSS3 Filtre Efektleri adlı yazımında sonuna geldik bir sonraki yazıda görüşmek üzere…

 

YORUMLAR ;