How to make button in circle like whatsapp circle button on click which show person list

Answer 1

<style>
.circle {
display:inline-block;
background:red;
border-radius:50%;
width:6em;
height:6em;
line-height:6em;
text-align:center;
overflow:visible;
}
</style>
<span class="circle">circle</span>

<!--
This will style any element to a red circle with text in the middle...
You can embed it in a <a> link element ( or style the link itself ), or any container ( can be a <button>, but an <input type="button"> must be styled as it cannot have html content, but just the 'value' attribute text type ):
-->

<a href="page.url"><span class="circle">circle</span></a>

<div class="circle" onclick="myfunc();">circle</div>

Answer 2

Create an image and then set a link to it