JSFiddle - React, Tailwind, and code Playground

HTML

<div class="circle"></div>

CSS

.circle {
    height: 10em;
    background-image: radial-gradient(circle 50px at 50% 0, transparent 50px, green 50px);
    background-image: -webkit-radial-gradient(50% 0, circle, transparent 50px, green 50px);
}

body {
    background: url(http://i.imgur.com/fC5Zh1n.png);
}