JSFiddle - React, Tailwind, and code Playground
HTML
<table width="100%">
<tbody>
<tr>
<td width="33%" valign="middle" align="center">
<img src="http://habrastorage.org/storage2/14e/702/a4f/14e702a4f122f4020fbb8297e332005b.png" />
</td>
<td width="33%" valign="middle" align="center">
<div class="css3ps"><span class="css3ps">CSS3Ps</span></div>
</td>
</tr>
<tr>
<td width="33%" valign="middle" align="center">
<div class="csshat"><span class="csshat">CSSHat</span></div>
</td>
<td width="33%" valign="middle" align="center">
<div class="markupwand"><span class="markupwand">markupwand</span></div>
</td>
</tr>
</tbody>
</table>
CSS
table { margin-top:40px; background-color: #222935; }
table td {
font-family:Arial, Helvetica, sans-serif;
font-size:42px;
padding: 10px 0;
vertical-align: top;
}
span {
display:inline-block;
line-height:104px;
font-weight:bold;
margin: 4px 0;
}
span.csshat {
width: 295px;
height: 104px;
-moz-border-radius: 39px; /* from vector shape */
-webkit-border-radius: 39px; /* from vector shape */
border-radius: 39px; /* from vector shape */
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box; /* prevents bg color from leaking outside the border */
-moz-box-shadow:
0 1px 8px #000 /* drop shadow */,
inset 0 1px 0 rgba(255,255,255,.69) /* inner shadow */,
inset 0 0 32px rgba(0,255,222,.52) /* inner glow */,
0 0 0 1px #07fff5 /* outer stroke */;
-webkit-box-shadow:
0 1px 8px #000 /* drop shadow */,
inset 0 1px 0 rgba(255,255,255,.69) /* inner shadow */,
inset 0 0 32px rgba(0,255,222,.52) /* inner glow */,
0 0 0 1px #07fff5 /* outer stroke */;
box-shadow:
0 1px 8px #000 /* drop shadow */,
inset 0 1px 0 rgba(255,255,255,.69) /* inner shadow */,
inset 0 0 32px rgba(0,255,222,.52) /* inner glow */,
0 0 0 1px #07fff5 /* outer stroke */;
background-image:...