JSFiddle - React, Tailwind, and code Playground

HTML

<figure>
    <img src="http://farm6.staticflickr.com/5168/5247594686_3bcdec0957.jpg" alt="Logo" />
</figure>

CSS

figure {
    display: inline-block;
    background: white;
    border: 1px solid black;
    overflow: hidden;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}
figure img {
    display: block;
    margin: 0;
    padding: 0;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}
figure:hover {
    background: #FFDB93;
    border: 1px solid orange;
}
figure:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    transform: scale(1.2);
    opacity: .5;
    filter: alpha(opacity=50);
}