blurred background in CSS

index.css

#bg {
  position: fixed;
  background-image: url("http://cosmetotheque.com/wp-content/uploads/2018/04/mario-gogh-589733-unsplash-1200x385.jpg");
  filter: blur(2px);
  width: 1000px;
  height: 300px;
}

#content {
  position: relative;
  font-size: 3rem;
}

index.html

<div>
  <div id="bg"></div>
  <div id="content">
    Hello Pierre  
  </div>
</div>