JSFiddle - React, Tailwind, and code Playground

HTML

<a class='href boy' href='#'>boy</a>
<a class='href girl' href='#'>girl</a>

CSS

.href {
    position: relative;
    display: inline-block;
}

.href::after {
    content: "";
    position: absolute;
    bottom: -50px;
    left: 0;
    display: none;
    width: 50px;
    height: 50px;
    background: black;
}

.boy::after {
    background: url('https://orig08.deviantart.net/8f46/f/2017/213/0/0/0063c7499766a6c3ec03c93dcf32643d-dbifxnu.gif') no-repeat 50% 50%;
}

.girl::after {
    background: url('https://orig03.deviantart.net/66f5/f/2017/229/a/7/icon_commission___by_ehikash-dbkg6ja.gif') no-repeat 50% 50%;
}

.href:hover:after {
    display: block;
}