JSFiddle - React, Tailwind, and code Playground

HTML

<div class="maboite">ma joliiiieee <br><br><br><br><br><br><br><br><br><br><br>boitboite</div>

CSS

.maboite {
   position:relative;
   background:green;
   border-radius:6px;
    width:150px;
}
.maboite:after {
  display:block;
content:" ";
background:red url("mafleche.png" ) no-repeat left top;
position:absolute;
right:-40px;  /*largeur de la fleche */
width:40px;
height:50px; /* hauteur de la fleche */
top : 50%; /*pour se positionner au centre de son parent */
margin-top:-25px /*pour bien centrer tout ça */
}