JSFiddle - React, Tailwind, and code Playground
by Galen Gidman
HTML
<span class="impact" data-shadow="#fff">Impact</span>
CSS
* {
margin: 0;
padding: 0;
}
html, body {
width: 100%;
height: 100%;
}
body {
background: url("http://i.imgur.com/UxB7TDq.jpg") no-repeat center;
background-size: cover;
}
.impact {
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
font: 72px Impact, sans-serif;
text-transform: uppercase;
}
JavaScript
var el = document.querySelector(".impact"),
shadow = el.dataset.shadow;
el.style.textShadow = '2px 2px ' + shadow;