below is how you create a tool tip in tailwind css without any external library.
HTML
<div class='has-tooltip'>
<span class='tooltip rounded shadow-lg p-1 bg-gray-100 text-red-500 -mt-8'>Some Nice Tooltip Text</span>
Custom Position (above)
</div>
CSS
.tooltip {
@apply invisible absolute;
}
.has-tooltip:hover .tooltip {
@apply visible z-50;
}
this is how it will look, you can customize as per your need.