const heightBox = document.querySelector('.box-height');
const widthBox = document.querySelector('.box-width')
const input = document.querySelector('.color-input');
const colorBox = document.querySelector('.color-box');

input.addEventListener("change", function() {
  colorBox.style.backgroundColor = input.value;
  colorBox.style.height = heightBox.value + 'px';
  colorBox.style.width = widthBox.value + 'px';
});

.color-box {
  background-color: limegreen;
  width: 100px;
  height: 100px;
}

<div class="color-box"></div>
<input class="color-input" placeholder="Type a color here!" /> <br>
<input class="box-height" placeholder="Type Height Here!" /> <br>
<input placeholder="Tpye Width here!" class="box-width" />