JSFiddle - React, Tailwind, and code Playground

by Rachel Gallen

HTML

<div class="wrap">
  <div class="image"> 
    <div class="text">
       <p>DAISIES</p>
    </div>
  </div>
</div>

CSS

.wrap{
  width:400px;
  background: #000 none repeat scroll 0% 0%;
  z-index: 0;
}
.image{
  background-image: url("http://rachelgallen.com/images/daisies.jpg");
  background-size:400px 400px;
  background-repeat:no-repeat;
  opacity: 0.9;
  height:400px;


}
.text, .text p{
 -webkit-filter:brightness(10) contrast(8);
  width:100px;
  color: #fff;
  font-weight:800;
}