JSFiddle - React, Tailwind, and code Playground

HTML

<div id="star12" >
   
  <p>
  platinum
  jsdkfsdjfkldfj
  dfsdkfjsklf
  </p>  
</div>

CSS

#star12 {
background: blue;
width: 120px;
height: 120px;
position: relative;
margin-left:50px;
margin-top:50px;
}
#star12:before, #star12:after {
content: "";
position: absolute;
top: 0;
left: 20;

height: 120px;
width: 120px;
background: blue;
}
#star12:before {
-webkit-transform: rotate(30deg);
-moz-transform: rotate(30deg);
-ms-transform: rotate(30deg);
-o-transform: rotate(30deg);
}
#star12:after {
 -webkit-transform: rotate(60deg);
 -moz-transform: rotate(60deg);
-ms-transform: rotate(60deg);
-o-transform: rotate(60deg);
}
p{
    width: 60px;
height: 60px;    
    position: absolute;
    z-index: 100;
    top: 10px;
    left: 10px;
    
}