JSFiddle - React, Tailwind, and code Playground

HTML

<div class="project__circle">
  <span></span>
</div>

SCSS

* {
	  box-sizing: border-box;
	}

	*::after,
	*::before {
	  box-sizing: border-box;
	}

	.project__circle {
	  margin: 20px;
	}

	.project__circle span {
	  position: relative;
	  display: block;
	  width: 9px;
	  height: 9px;
	  background-color: red;
	  border-radius: 50%;
	}

	.project__circle span::after,
	.project__circle span::before {
	  position: absolute;
	  content: ' ';
	  display: block;
	  width: 9px;
	  height: 9px;
	  background-color: red;
	  border-radius: 50%;
	  top: -2px;
	}

	.project__circle span::before {
	  right: 11px;
	}