Skip to content

Instantly share code, notes, and snippets.

@davidguttman
Created October 11, 2018 01:12
Show Gist options
  • Save davidguttman/94d30448eaf3a226fc2eafe590c714b2 to your computer and use it in GitHub Desktop.
Save davidguttman/94d30448eaf3a226fc2eafe590c714b2 to your computer and use it in GitHub Desktop.
<div id='colorsquare2'></div>
<script>
var cs2 = window.colorsquare2
cs2.style.cssText = `
width: 200px;
height: 200px;
border: 2px solid black;
`
window.addEventListener('mousemove', function (evt) {
var x = evt.clientX / window.innerWidth
var y = evt.clientY / window.innerHeight
var hue = Math.round(y * 360)
var light = Math.round(x * 100)
var color = `hsl(${hue}, 100%, ${light}%)`
cs2.style.background = color
})
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment