JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="outer">
        <div class="inner">my text</div>
    </div>
</div>

CSS

.wrapper {
    height:400px;
    width:400px;
    background-image:url('http://www.chidi.com/images/canvas/abstract/trailsofdream.jpg');
    background-size:cover;
}
.outer {
    width:50px;
    height:50px;
    -webkit-filter: blur(1px);
    -moz-filter: blur(1px);
    -ms-filter: blur(1px);
    -o-filter: blur(1px);
    filter: blur(1px);
}
.inner{
    background-color:red;
}