• HTML
• CSS

HTML

<div class="contenedor">
    <img src="Monkey_D_Luffy.png" class="uno">
    <img src="Monkey_D_Luffy.png" class="dos">
    <img src="Monkey_D_Luffy.png" class="tres">
    <img src="Monkey_D_Luffy.png" class="cuatro">
    <img src="Monkey_D_Luffy.png" class="cinco">
</div>

CSS

.contenedor img{
    width:8em;
    height:24em;
}

img.dos{
    filter:grayscale(100%);
}
img.tres{
    filter:sepia(80%);
}
img.cuatro{
    filter:hue-rotate(90deg);
}
img.cinco{
    filter:blur(0.1em);
}

/**********************************************
    Se recomienda usar los Prefijos:
        -webkit-filter 
        -moz-filter
        -o-filter
    para la compatibilidad en navegadores
    
    Ojo existen más filtros como:
        invert(%)
        brightness(%)
        contrast(%)
        drop-shadow(...)

**********************************************/