JSFiddle - React, Tailwind, and code Playground
HTML
<div class="buttons">
<button class="demo">PLAY DEMO</button>
<button class="source">DOWNLOAD CODE</button>
</div>
CSS
.buttons{width:100%;height:50px;}
button{margin:0px 5px;}
button.demo{
font:bold 14px 'Lato', sans-serif;
padding:5px 0 5px 0;
text-align:center;
text-shadow:0px -1px 1px #1e2d4d;
width:100px;margin:2px 5px 4px;}
button.demo:hover{
box-shadow: inset 0 0px 10px 1px #87adff, 0px 1px 0 #1d2c4d, 0 3px 0px #1f3053, 0 2px 2px 1px #111111;
cursor: pointer;}
button.demo:active {
box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 1px 0 #1f3053, 0 1px 1px 0 #111111;
margin:4px 5px 2px;
vertical-align: top;}
button.source{
background: #4162a8;
border-top: 1px solid #38538c;
border-right: 1px solid #1f2d4d;
border-bottom: 1px solid #151e33;
border-left: 1px solid #1f2d4d;
border-radius: 4px;
box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 3px 0px #1f3053, 0 2px 2px 1px #111111;
color: #fff;
font:bold 14px 'Lato', sans-serif;
margin-bottom:10px;
padding:5px 0 5px 0;
text-align:center;
text-shadow:0px -1px 1px #1e2d4d;
width:150px;
margin:2px 5px 4px;}
button.source:hover{
box-shadow: inset 0 0px 10px 1px #87adff, 0px 1px 0 #1d2c4d, 0 3px 0px #1f3053, 0 2px 2px 1px #111111;
cursor: pointer;}
button.source:active {
box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 1px 0 #1f3053, 0 1px 1px 0 #111111;
margin:4px 5px 2px;
vertical-align: top;}