JSFiddle - React, Tailwind, and code Playground

by Vishnuprasad ps

HTML

<div id="imagePanel">
  <div class="panel panel-blue">
    <div class="blueBorder>
    <div>
     
    </div>
    </div>
  </div>
</div>

CSS

#imagePanel .panel {
  background-color: #28c3d7;
  position: relative;
  text-align: center;
  height: 100%;
  padding-bottom: 80px;
}

#imagePanel .panel>div:first-child:after {
  position: relative;
  display: block;
  width: 100%;
  height: 22px;
  margin-top: -11px;
  content: '';
  border-top: 22px dotted #fff;
  z-index: 2;
}