::after pseudo-element adds small arrow style

.showTips{
  position: absolute;
  top: -35px;
  right: 5px;
  border: 1px solid #c3d0e2;
  border-radius: 5px;
  padding: 2px;
  color: #788ca7;
  background: #f7f8fb;
  font-weight: 500;
  box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  &::before{
    box-sizing: content-box;
    position: absolute;
    top: 21px;
    left: 30.1px;
    border-bottom: 5px solid transparent;
    border-top: 5px solid #f7f8fb;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    display: block;
    content: '';
    z-index: 2;
  }
  &::after{
    box-sizing: content-box;
    position: absolute;
    top: 22px;
    left: 30px;
    border-bottom: 5px solid transparent;
    border-top: 5px solid rgb(190, 190, 190);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    display: block;
    content: '';
    z-index: 1;
  }
}