JSFiddle - React, Tailwind, and code Playground

HTML

<div class="large-columns">
		<div class="circle-holder">
				<span class="circle"><h1>h tag</h1></span>
		</div>					
</div>

CSS

.circle {
    display: block;
    width: 10em;
    height: 10em;
    background: red;
    position: relative;
    border-radius: 50%;
}    
    h1 {
      text-align: center;
      position: absolute;
      top: 50%;

}