JSFiddle - React, Tailwind, and code Playground

by Ellinor Bergman

HTML

<div class="top-field">
				<div class="bg-image" style="background-image: url('https://source.unsplash.com/category/nature/1600x900')"></div>
        </div>

CSS

.top-field {
	min-height: 300px;
}

.top-field .bg-image {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    filter: grayscale(100%);
}