SOURCE

<div class="t1">Hello</div>

<div class="t2">Hello</div>

.t1 {
    width: 100px;
    border-bottom: 100px solid red;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
}

.t2 { 
    position: relative;
    display: inline-block;
    padding: .5em 1em .35em;
    color: white; 
} 
.t2::before { 
    content: ''; /* To generate the box */ 
    position: absolute; 
    top: 0; right: 0; bottom: 0; left: 0; 
    z-index: -1; background: #58a; 
    transform: scaleY(1.3) perspective(.5em) rotateX(5deg); 
    transform-origin: bottom;
}