JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box" >
    <div class="item">
    1
    </div>
    <div class="item">
   2
    </div>
    <div class="item">
   3
    </div>
  </div>

CSS

.box{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* place-items: stretch; */
    border-radius: 60px;
    position: absolute;
    bottom: 0;
    /* left: 0; */
    justify-items: center;
    width: 100%;
    z-index: 2;
    background-image: linear-gradient(90deg, #191938, #272550,#383263, #3e3368);
    top: 2px;
    color: #FFF;
    /* transform: translate3d(0, 0, -400px); */
}