JSFiddle - React, Tailwind, and code Playground

HTML

<div id="my_container">
</div>

CSS

#my_container {
  position: relative;
  width: 200px;
  height: 200px;
  background-color: powderblue
}

.cell {
  background-color: red;
  width: 5px;
  height: 5px;
  position: absolute;
}

JavaScript

const container = document.getElementById("my_container");
const number_of_cells = 30;
const cells = [];
for (var i = 0; i < number_of_cells; i++)
{
    const newDiv = document.createElement("div");
    newDiv.classList.add("cell");
    container.appendChild(newDiv)
    cells.push(newDiv); 
}

function PositionCells(cells, x, y, radius)
{
  const incr_angle = (2*Math.PI)/cells.length;
  for (let i = 0; i < cells.length; i++) {
      var new_x = x+radius * Math.cos(incr_angle * i);
      var new_y = y+radius * Math.sin(incr_angle * i);
      cells[i].style.left = new_x+'px';
      cells[i].style.top = new_y+'px';

  }
}

PositionCells(cells, 50,50,30);