JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <div class="wrapper"></div>
</body>

CSS

body: {
            margin:0px;
        }

        .wrapper {
            position:absolute; 
            top:0px; 
            bottom:0px; 
            left:0px; 
            right:0px; 
            background-color:white;
            margin:0px;
        }

        .dot{
            background-color: black;
            width: 3px;
            height: 3px;
            position:absolute;
        }

JavaScript

var x = [];
var y = [];
var centre = [100,100];
var radius = 70;
var numPoints = 10;
var theta = 350.00 / numPoints;

for (var i = 1; i <= numPoints; i++) {

    // calc x/y
    x[i] = radius * Math.cos(2*Math.PI*i/numPoints + theta) + centre[0];
    y[i] = radius * Math.sin(2*Math.PI*i/numPoints + theta) + centre[1];

    // create div at point:
    var div = document.createElement("div");
    div.setAttribute('class', 'dot');
    div.style.left = x[i] + "px";
    div.style.top = y[i] + "px";
    document.body.appendChild(div);
}