JSFiddle - React, Tailwind, and code Playground

HTML

<input type="number" min="0" max="100" step="2" value="0">
<input type="range" min="0" max="100" step="2" value="0">

JavaScript

jQuery(function ($) {
  $.cssHooks.numberValue = {
    get: function (elem) {
      return elem.value;
    },
    set: function (elem, value) {
      elem.value = Math.round(parseFloat(value) / elem.step) * elem.step;
    }
  };
  $.fx.step.numberValue = function (fx) {
    jQuery.style( fx.elem, fx.prop, fx.now );
  };
  $('input[type=number], input[type=range]').animate({numberValue: 50}, 5000);
});