wheel.css

body {
  min-height: 100vh;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

div {
  width: 105px;
  height: 105px;
  background: #ccddff;
  padding: 5px;
}

wheel.html

<div id="scaling-box">Scale me with your mouse wheel.</div>

wheel.js

/**
 * https://developer.mozilla.org/en-US/docs/Web/API/Element/wheel_event#examples
 */

let scale = 1
const el = document.querySelector('#scaling-box')

function applyZoom(event) {
  event.preventDefault()

  scale += event.deltaY * -0.01

  // Restrict scale
  scale = Math.min(Math.max(0.125, scale), 4)

  // Apply scale transform
  el.style.transform = `scale(${scale})`
}

el.onwheel = applyZoom