JSFiddle - React, Tailwind, and code Playground

HTML

<div class='q'>
  
</div>

CSS

*{
  margin: 0;
}

.q{
 background: red;
  width:100px;
  height:100px;
}

JavaScript

const targetNode= document.querySelector('.q')
const centerX = targetNode.offsetLeft + targetNode.offsetWidth / 2;
const centerY = targetNode.offsetTop + targetNode.offsetHeight / 2;

console.log(centerX, centerY)