JSFiddle - React, Tailwind, and code Playground

by octavioamu

HTML

<div class="circle multi-line">
    Some Text
</div>

<div class="circle multi-line">
    Some Text<br>
    Some More
</div>

CSS

.circle{
    margin:10px;
    width:100px;
    height:100px;
    border-radius:100%;
    background-color:#3D6AA2;
    color:#fff;
    text-align:center;
    font-size:14px;
    overflow:hidden;
}

.circle.one-line{line-height:100px;}
.circle.multi-line{
    padding-top:30px;
    height:70px;
}