JSFiddle - React, Tailwind, and code Playground

by Alex Slepenkov

HTML

<div clas="wrapper">
<div class="emboss">
  text
</div>
</div>

CSS

.emboss{
  width:200px;
  line-height:80px;
  border-radius:16px;
  background:rgba(0,0,0,0.1);
  box-shadow:inset -5px -5px 5px 0 rgba(0,0,0,.5), 
             inset 5px 5px 5px 0 rgba(255,255,255,0.5);
  font-size:40px;
  text-align:center;
  font-family:"Myriad Pro", Arial, Helvetica, sans-serif;
  text-transform:uppercase;
  color:#333;
  margin:50px auto;
}
.wrapper{
   background:rgba(23,160,24,0.1);
}