• HTML
• CSS

HTML

<div class="contenedor">
    <img src="Monkey_D_Luffy.png">
</div>

CSS

.contenedor img{
    width:200px;
    height:450px;
    filter:grayscale(100%);
    transition:0.6s all;
    cursor:pointer;
}

img:hover{
    filter:none;
    
}

/*
    Para la compatibilidad de navegadores se recomienda usar los prefijos:
        -webkit-filter 
        -moz-filter
        -o-filter
*/