Arka plan
Filtre efektleri bir süredir kullanımdaydı ancak SVG'de çalışacak şekilde tasarlanmışlar. Renk yoğunluğu, eğme veya bulanıklaştırma gibi efektlerin bir resimle birleştirilip dokümanda oluşturulmadan önce uygulanmasında olağanüstü güçlü bir etkiye sahiptir.
2009'da Mozilla, SVG'nin yeterli olmadığını söylemişti! Sonunda filtreler bir adım daha ileri gidip Firefox 3.5'te HTML içeriğine izin verildi. Paul Ireland'ın <video> oynarken hazırladığı, zamana meydan okuyan SVG filtrelerinin demosuna göz atın. Yine, yalnızca Firefox'ta çalışır, ancak dizleri hâlâ vardır.
Bugün
2011'in sonuna kadar Flash'la başlayın ve Adobe (ve diğerleri) bu muhteşem teknolojiyi CSS'ye getirmek için yoğun bir şekilde çalışıyor. Daha ayrıntılı olarak belirtmek gerekirse, WebKit'in uygulamaya başladığı CSS Filtre Efektleri 1.0'dan bahsediyorum.
Filtreleri doğrudan CSS'de etkinleştirmek, neredeyse tüm DOM öğelerinin bunlardan yararlanabileceği anlamına gelir! Resimler (<video>, <canvas>)
Gelecekteki
Spesifikasyon, zaman içinde OpenGL gölgelendirici teknolojisini CSS'ye getirecek CSS gölgelendiricilerini de tanımlar. Bu ÇOK heyecan verici! Bununla birlikte, bir sistemin GPU'sunu her açtığınızda güvenlikle ilgili olarak göz önünde bulundurulması gereken noktalar vardır. Bu nedenle WebKit'e şimdilik yalnızca CSS filtre işlevleri uygulanmıştır.
Destek
Chrome 18.0.976.0 (şu anda Canary), Webkit gecelik
Webkit geceliklerinde, donanım hızlandırmalı içeriğe ( ör. img { -webkit-transform: translateZ(0); }) filtreler uygulanabilir. Chrome'da hızlandırılmış içerik filtreleri hâlâ geliştirme aşamasındadır (--enable-accelerated-filters işaretini kullanın). Bu, varsayılan olarak hızlandırılan <video>'yi içerir.