console
<div class="container">
<div class="text">Text 1</div>
<div class="text">Text 2</div>
<div class="text">Text 3</div>
<div class="text">Text 4</div>
<div class="text">Text 5</div>
<div class="text">Text 6</div>
<div class="text">Text 7</div>
<div class="text">Text 8</div>
</div>
.container {
width: 300px;
height: 300px;
position: relative;
border: 1px solid pink;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.text {
position: absolute;
transform-origin: center;
text-align: center;
color: #b11d49;
}
.text:nth-child(1) { transform: rotate(0deg) translateY(-130px) rotate(0deg); }
.text:nth-child(2) { transform: rotate(45deg) translateY(-130px) rotate(-45deg); }
.text:nth-child(3) { transform: rotate(90deg) translateY(-130px) rotate(-90deg); }
.text:nth-child(4) { transform: rotate(135deg) translateY(-130px) rotate(-135deg); }
.text:nth-child(5) { transform: rotate(180deg) translateY(-130px) rotate(180deg); }
.text:nth-child(6) { transform: rotate(225deg) translateY(-130px) rotate(135deg); }
.text:nth-child(7) { transform: rotate(270deg) translateY(-130px) rotate(90deg); }
.text:nth-child(8) { transform: rotate(315deg) translateY(-130px) rotate(45deg); }