JSFiddle - React, Tailwind, and code Playground

Адаптивный вариант

by Ankhena

HTML

<div></div>

CSS

* {
  box-sizing: border-box
}

html,
body {
  height: 100%;
  padding: 0;
  margin: 0;
}

div {
  background: radial-gradient(farthest-side at top, transparent 99%, white 100%) no-repeat center calc(100% + 1px) / 120% 25%, url('http://cdn2.livelongandtravel.com/travel-by-train-1920x1200.jpg') no-repeat top center / cover;
}
div::after {
  content: '';
  display: block;
  padding-top: 50%; 

}