Contexto
Os efeitos de filtro já existem há algum tempo, mas foram projetados para funcionar no SVG. Eles são fantásticos na aplicação de efeitos como intensidade de cor, distorção ou desfoque em uma imagem antes de ela ser composta e renderizada no documento.
Bem, em 2009, a Mozilla disse que o SVG não era suficiente. Eles acabaram levando os filtros um passo adiante e permitiram-nos em conteúdo HTML no Firefox 3.5. Confira a demonstração atemporal de Paul Irish sobre filtros SVG em um <video> em execução. Novamente, só funciona no Firefox, mas ainda é o máximo.
Hoje
No final de 2011, a Adobe e outras empresas trabalharam muito para trazer essa tecnologia incrível para o CSS. Mais especificamente, estou me referindo aos efeitos de filtro CSS 1.0, que o WebKit começou a implementar.
Ativar filtros diretamente no CSS significa que quase qualquer elemento DOM pode aproveitar isso. Imagens, <video>, <canvas>, você escolhe.
Futuro
A especificação também define shaders CSS, que vão trazer a tecnologia de shader OpenGL para o CSS. Isso é muito empolgante! No entanto, há considerações de segurança sempre que você abrir a GPU de um sistema. Por isso, o WebKit só tem funções de filtro CSS implementadas no momento.
Suporte
Chrome 18.0.976.0 (atualmente Canary), Webkit noturno
Nas versões noturnas do Webkit, os filtros podem ser aplicados a conteúdo acelerado por hardware ( por exemplo, img { -webkit-transform: translateZ(0); }). No Chrome, os filtros em conteúdo acelerado ainda estão em desenvolvimento (use a flag --enable-accelerated-filters). Isso inclui <video>, que é acelerado por padrão.