JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li><a class="green" href="#"></a></li>
    <li><a class="blue" href="#"></a></li>
</ul>

CSS

ul { list-style: none; margin: 20px 0 0 20px; padding: 0; }

ul li { margin-bottom: 10px; }

a { display: block; width: 60px; height: 60px; }

a:hover { background: DimGray; }

.green { background: YellowGreen; }
.blue { background: MidnightBlue; }