How can I scale/transform a css element in react gradually when a user increments a range slider?

I have a range-slider component and have it console.logging output whenever the slider is changed/moved/incremented. I want this to trigger a change in the scale of a css shape so the css shape grows in size as you incerement the volume slider from 1 - 10. I have my css styling sitting in separate .scss files.