JSFiddle - React, Tailwind, and code Playground

by darcyclarke

HTML

<a href="http://google.com" title="Google" class="icon-google">Google Link</a>

CSS

.icon-google {
 display: block;
 width: 1px;
 height: 1px;
 padding: 20px 0 0 20px;
 overflow: hidden;
 border: 1px solid #fff;
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
 border-radius: 3px;
 -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5); 
 -moz-box-shadow: 0 0 5px rgba(0,0,0,0.5);
 box-shadow: 0 0 5px rgba(0,0,0,0.5);
 background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#bfbfbf));
    background: -moz-linear-gradient(top,  #ffffff,  #bfbfbf);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#bfbfbf');
}

.icon-google:hover {
 cursor: pointer;   
}