JSFiddle - React, Tailwind, and code Playground

HTML

<div class="blur">
    <span class="inner">&nbsp;</span>
    <span class="inner">&nbsp;</span>
    <span class="inner">&nbsp;</span>
    <span class="inner">&nbsp;</span>
    <span class="inner">&nbsp;</span>
</div>
<div>
    <p>
    Ihan normaali<span class="blur">einäy</span> tää <span class="textshadow">&nbsp;</span>näkyy
    </p>
</div>
</div>
 <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <defs>
    <filter id="wherearemyglasses" x="0" y="0">
      <feGaussianBlur in="SourceGraphic" stdDeviation="1" />
    </filter>
  </defs>
</svg>

CSS

.blur {
  filter:url(#wherearemyglasses);
  /* ^ for Firefox */
  -webkit-filter: blur(6px);  
  /* ^ Webkit browsers */
  filter: blur(6px);  
}
.inner{
    width:30px;
    display:inline-block;
    background:#696969;
}
.textshadow {
   color: transparent;
   display:inline-block;
   width:30px;
   text-shadow: 0 0 10px rgba(0,0,0,0.5);
}