JSFiddle - React, Tailwind, and code Playground

HTML

<div id="outer">
  <div id="inner"></div>
</div>

CSS

#outer {
  background:blue;
  height: 150px;
}

#inner {
  bottom: 0;
  left: 0;
  right: 0;
  height: 150px;
  border-bottom-left-radius: 50%;
  border-bottom-right-radius: 50%;
  background: red;
}