<div class="box-with-text">
Text
</div>
/* Main styles */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:800);
.box-with-text {
background-image: -webkit-linear-gradient(crimson 50%, white 50%);
background-repeat: repeat;
background-position: 0 0;
background-size: 100% 50px;
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
-webkit-animation: stripes 2s linear infinite;
animation: stripes 2s linear infinite;
}
@-webkit-keyframes stripes {
100% {
background-position: 0 -50px;
}
}
@keyframes stripes {
100% {
background-position: 0 -50px;
}
}
/* Other stuff */
body {
overflow: hidden;
background: #000;
color: #FFF;
}
.box-with-text {
position: absolute;
top: 50%;
left: 50%;
white-space: nowrap;
text-align: center;
text-transform: uppercase;
font: bold 26vmax/.8 Open Sans, Impact;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}