SOURCE

var box=document.querySelector(".box");
var arr=[];
for (let i=0; i<625; i++) {
    arr[i]=document.createElement("span");
    arr[i].classList.add("point");
    arr[i].addEventListener("mouseover",function() {
        var r=Math.floor(Math.random()*256);
        var g=Math.floor(Math.random()*256);
        var b=Math.floor(Math.random()*256); 
        var co="rgb("+r+','+g+','+b+")";
        this.style.background=co;
        this.classList.add("over");
        setTimeout(function(){
           arr[i].style.backgroundColor="#555";
           arr[i].classList.remove("over")},2000);
           
        console.log(co)
    })
    box.appendChild(arr[i]);
}

<div class="box"></div>

body {
    background-color: #333;
    display: flex;
    justify-content: center;
    /* align-content:center ; */
    align-items: flex-start;
    
}
.box {
    position: absolute;
    width: 300px;
    height: 300px;
    background-color: #333;
    display: flex;
    /* justify-content: center; */
    align-content: flex-start;
    flex-wrap: wrap;
}
.point {
    width: 10px;
    height: 10px;
    background-color: #555;
    margin: 1px; 
    transition: 1s ease;
}
.over {
    /* position: absolute; */
    z-index: 2;
    box-shadow: 0 0 3px 2px white;
}
/* .point:hover {
    background-color: lawngreen;
} */