Starry night in pure Javascript
by Farzad YZ
HTML
<div id="stars"></div>
CSS
body {
background-color: #000;
height: 100%;
margin: 0;
}
#stars {
width: 2px;
height: 2px;
border-radius: 50%;
position: absolute;
top: 0;
left: 0;
}
JavaScript
function getRandomInArray(array = []) {
return Math.floor(Math.random() * array.length);
}
function getRandom(to) {
return getRandomInArray([...Array(to).keys()])
}
console.log(getRandom(10))
const output = []
for (let i = 0; i < 400; i++) {
output.push([getRandom(5000), getRandom(840)])
}
const starsShadow = output.map(o => `${o[0]}px ${o[1]}px #3f4143`).join(', ');
console.log(starsShadow)
document.getElementById('stars').style.boxShadow = starsShadow;