JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<div class="box">
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio voluptatem enim libero consequatur officiis sapiente omnis odit quaerat fugit accusamus facere earum minus cum accusantium maxime assumenda, sunt, vero ad!
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio voluptatem enim libero consequatur officiis sapiente omnis odit quaerat fugit accusamus facere earum minus cum accusantium maxime assumenda, sunt, vero ad!  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio voluptatem enim libero consequatur officiis sapiente omnis odit quaerat fugit accusamus facere earum minus cum accusantium maxime assumenda, sunt, vero ad!  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio voluptatem enim libero consequatur officiis sapiente omnis odit quaerat fugit accusamus facere earum minus cum accusantium maxime assumenda, sunt, vero ad!
<div class="body">
 
</div>
</div>

CSS

body {
  margin: 0;
  background: url('http://images.fanpop.com/images/image_uploads/water-wallpapers-400709_1809_1357.jpg') no-repeat;
}
div.box {
  width: 400px;
  height: 400px;
  /* filter: blur(1px); */
  background: rgba(0,0,0,0.2);
}
div.body {
  width: 100%;
  height: 100%;
  background: transparent;
  opacity: .6;
  filter: blur(10px);
}