JSFiddle - React, Tailwind, and code Playground

HTML

<div data-tooltip="This is my tooltip">
  <div>
  Makan ayam
  </div>
</div>

CSS

div:hover:before {
    content: attr(data-tooltip);
    position: absolute;
    padding: 5px 10px;
    margin: 0 0 30px 0;
    background: orange;
    color: white;
    border-radius: 3px;
}

div:hover:after {
    content: '';
    position: absolute;
    margin: 0 0 30px 0;
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-right: 10px solid black;
	border-bottom: 5px solid transparent;
}