JSFiddle - React, Tailwind, and code Playground

HTML

<p class="test">

  <b class="trapezoid"></b>

 </p>

CSS

body {font: 80% helvetica, arial, sans-serif;}

 

.trapezoid { 

    display:block;

    margin:0;

    padding:0;

    width:1px; 

    height:1px;

    background:transparent;

    border-style: solid;

     border-color:#000 #951b1b #eee #eee;

    border-width: 30px 30px 500px 20px;

}