JSFiddle - React, Tailwind, and code Playground

by josedvq

HTML

<script src="http://commons.wikimedia.org/wiki/File:Home_Icon.svg"></script>
<div class="round-button">
    <a href="http://example.com"><img src="http://codeitdown.com/media/Home_Icon.svg" alt="Home" /></a>
</div>

CSS

.round-button {
    width: 10%;
    height: 0;
    padding-bottom: 10%;
    border-radius: 50%;
    border: 2px solid #f5f5f5;
    overflow: hidden;
    background: #464646;
    box-shadow: 0 0 3px gray;
}
.round-button:hover {
    background: #262626;
}
.round-button img {
    display: block;
    width: 76%;
    padding: 12%;
    height: auto;
}