HTML
<div class="area">⚠ The Tech Platform ⚠</div>
CSS
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
body {
background: #111;
font-family: "Open Sans", Impact;
}
.area {
text-align: center;
font-size: 5.5em;
color: #fff;
letter-spacing: -7px;
font-weight: 700;
text-transform: uppercase;
animation: blur .75s ease-out infinite;
text-shadow: 0px 0px 5px #fff, 0px 0px 7px #fff;
}
@keyframes blur {
from {
text-shadow:0px 0px 10px #fff,
0px 0px 10px #fff,
0px 0px 25px #fff,
0px 0px 25px #fff,
0px 0px 25px #fff,
0px 0px 25px #fff,
0px 0px 25px #fff,
0px 0px 25px #fff,
0px 0px 50px #fff,
0px 0px 50px #fff,
0px 0px 50px #7B96B8,
0px 0px 150px #7B96B8,
0px 10px 100px #7B96B8,
0px 10px 100px #7B96B8,
0px 10px 100px #7B96B8,
0px 10px 100px #7B96B8,
0px -10px 100px #7B96B8,
0px -10px 100px #7B96B8;
}
}
Output:
![](https://static.wixstatic.com/media/0f65e1_cdece5bb220c46018e4a1360e4dc0bb3~mv2.png/v1/fill/w_49,h_7,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/0f65e1_cdece5bb220c46018e4a1360e4dc0bb3~mv2.png)
![](https://static.wixstatic.com/media/0f65e1_92a2df62fdea4e5ea0dad896d5199866~mv2.png/v1/fill/w_49,h_7,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/0f65e1_92a2df62fdea4e5ea0dad896d5199866~mv2.png)
![](https://static.wixstatic.com/media/0f65e1_1fb47b2067ac47b0b66158a963f3affa~mv2.png/v1/fill/w_49,h_8,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/0f65e1_1fb47b2067ac47b0b66158a963f3affa~mv2.png)
Click on the link below to see the effect
Source: codepen
The Tech Platform