JSFiddle - React, Tailwind, and code Playground

HTML

<div>
Section 1...
</div>
<hr>
<div>
Section 2...
</div>

CSS

body {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTfVd4SAHW7hs4sMX8Q2JXgfX_0tFBN47iNWQYFn6TeYpGUhtWYbqFADFo");
  -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        background-repeat: no-repeat;
}
hr {
  border: 0;
  border-top: 4px double white;
  text-align: center;
}
hr:after {
  content: '\2665';
  display: inline-block;
  position: relative;
  top: -12px;
  padding: 0 10px;
  background: transparent;
  color: white;
  font-size: 18px;
}