| Move your cursor!

body
  min-height 100vh
  text-align center
  line-height 100vh
  font-family sans-serif
  color hsl(0, 0%, 98%)
  background hsl(280, 50%, 50%)
  font-weight bold
  font-size 2rem

import gsap from 'https://cdn.skypack.dev/gsap'

const BOUNDS = 100

const UPDATE = ({ x, y }) => {
  const boundX = gsap.utils.mapRange(0, window.innerWidth, -BOUNDS, BOUNDS, x)
  const boundY = gsap.utils.mapRange(0, window.innerHeight, -BOUNDS, BOUNDS, y)
  document.body.innerText = `x: ${Math.floor(boundX) / 100}; y: ${Math.floor(boundY) / 100};`
}

document.addEventListener('pointermove', UPDATE)