JSFiddle - React, Tailwind, and code Playground

HTML

<div class="column">
  <h1 class="header">Header</h1>
  <p class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>

CSS

.column{
  width: 50%;
  margin:20px auto 0;
  padding-top: 90px;
  position: relative;
}

.column:before{
  content:"";
  width: 80px;
  height:80px;
  border-radius: 50%;
  border: 2px solid black;
  top:0;
  left: 50%;
  transform:translateX(-50%);
  position: absolute;
  display:block;
  background-image:url("https://user-profile.s3.envato.com/files/71648776/profile-icon.png")
}



.header{
  text-align:center;
}

.text{
  text-align:center;
}