JSFiddle - React, Tailwind, and code Playground

HTML

<div style="margin: 20px">
    <div class="popover">
        Test content
    </div>
</div>

CSS

.popover {
    position: relative;
    margin: 0 auto;
    max-width: 300px;
    padding: 20px;
    background-color: #fff;
    border: 2px solid #000;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.popover:after,
.popover:before {
    content: "";
    position: absolute;
    left: 100%;
    width: 0;
    height: 0;
    border-style: solid;
}

.popover:before {
    z-index: 1;
    top: 13px;
    margin-left: 1px;
    border-color: transparent transparent transparent #000;
    border-width: 11px 24px 11px 28px;
}

.popover:after {
    z-index: 2;
    top: 15px;
    border-color: transparent transparent transparent #fff;
    border-width: 9px 12px 9px 25px;
}