<main>
<a class="btn" href="#">button</a>
</main>
main{
text-align: center;
padding:20%;
}
.btn{
line-height: 1.25;
text-decoration:none;
font-weight:bold;
background:#8dc21f;
color:#fff !important;
border-radius:.5em;
padding:1em 4em;
text-align: center;
position: relative;
transition:.3s;
}
.btn:after{
content:"";
position:absolute;
top:0;
bottom:.1em;
right:5%;
margin:auto;
width: .3em;
height: .3em;
border-top: .05em solid #fff;
border-right: .05em solid #fff;
transform: rotate(45deg);
transition:.3s;
}
a:hover{
opacity:.75;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.