JSFiddle - React, Tailwind, and code Playground

by Ilia Lesnykh

HTML

<div class="r">1</div>
<div class="g">2</div>
<div class="b">3</div>

CSS

body { margin: 20px; }
div {
    width:200px;
    background:red;
    height:100px;
    -webkit-border-bottom-right-radius: 100px 50px;
    -webkit-border-bottom-left-radius: 100px 50px;
    -moz-border-radius-bottomright: 100px 50px;
    -moz-border-radius-bottomleft: 100px 50px;
    border-bottom-right-radius: 100px 50px;
    border-bottom-left-radius: 100px 50px;
    /* добавлено */
    float: left;
    margin-left: -10px;
    /* можно удалить */
    color: #fff;
    font-size: 20px;
    text-align: center;
    line-height: 100px;
    opacity: .5;
}
.r { background:red; }
.g { background:green; }
.b { background:blue; }