soy Kseso y esto EsCSS

Yes, we fun! with SVG & Css

El famoso efecto de los carteles del "yes, we can!" (imágenes en duotono o dos colores) realizados en puro Css y el filtro SVG feColorMatrix a partir de una imagen cualquiera en color verdadero.

Yes, we fun! with SVG & Css

·Por Kseso ✎ 0

Después del artículo previo a éste, El filtro SVG feColorMatrix y su matriz, en el que lo dedicaba a explicar a fondo cómo construir su la matriz obtener imágenes en uno o dos tonos con los colores deseados, me apetecía recrear con él algún efecto gráfico de sobra conocido.

Y para imágenes en duotono nada como los veteranos carteles del Yes, we can! que tan de moda estuvieron en su día.

Teniendo claro cómo introducir los dos colores en la matriz del filtro SVG feColorMatrix y con un poco más de Css ya visto en otras demos del blog, es sencillo emularlos.

Otra cosa es que los dos colores "peguen" (que diría mi abuela) y otra que "se peguen". Pero eso no es cuestión de código si no de gusto (bueno o malo según cada uno).

El resultado, el que puedes ver en la imagen posterior que también es el enlace para ver el pen:

Yes, we fun! with SVG // un juego con filtros SVG y CSS
Ver la demo en Codepen

Ver Demo a Full

avatar del Editor del blog

the obCSServer ᛯ Ramajero Argonauta, Enredique Amanuense de CSS.
#impoCSSible inside
Dicen que, en español, EsCss es el mejor blog de CSS. Posíblemente exageren.
@Kseso EsCss Kseso