JSFiddle - React, Tailwind, and code Playground

by dreamgt

HTML

<div class="background">
  <div class="overlay">
  </div>
    <div class="text">
      VISIT NEW ZEALAND
    </div>
</div>

CSS

div { 
  width: 620px;
  height: 330px;
  }
  
.background {
  background-image: url("https://www.irishtimes.com/polopoly_fs/1.3236225.1506546417!/image/image.jpg_gen/derivatives/box_620_330/image.jpg");
}

.overlay {
  background-color: turquoise;
  opacity: .5;
}

.text {    
    font-family: impact;
    font-size: 3.5em;
    color: white;
    position: absolute;
    top: 0;
    padding: 4px;
}