JSFiddle - React, Tailwind, and code Playground

HTML

<div class="skew">
    <p>Texto dentro do skew</p>
</div>

CSS

body {
    text-align:center;
}
.skew {
    background:#f0f;
    padding:40px 80px;
    text-align:center;
    color:#000;
    display:inline-block;
    width:400px;
    
    /* MÁGICA */
    transform:skew(40deg);
}
.skew p {
    transform:skew(-40deg);
}