Dial control <input type="range"> to populate a field

My objective is to manage my personal fitness in gradual, manageable, calculated, scalable, trackable and practical/pragmatic way.
Hence I need to create form that I can create my workout plan and track the exercise/equipent/muscle I am training as I am executing them; often recording my reps on my mobile usually with sweating fingers. Which is an advantage; you are able to move the slider and see the values change until you hit the number value you intend to input without needing to type in a value using the mobile keyboard. Thus I prefer the convinience of the HTML element of type range which allows participants to specify a numeric value based their own Rate of Perceived Exertion (RPE) which must be no less than a given value (min hypertrophy level), and no more than another given value determined each participant’s 1-RMax strength. Clones of this tiddler i suppose could be forked to help track my weight/waist size or vitamin/mineral/calories consumption if I wanted to track other progresses periodically.

Can anyone replicate a tiddlywiki functional version of these examples of the element of type range I am refering to:

The output syntax is explained here:

see https://tiddlywiki.com/#RangeWidget

Oh wow thank you Eric!

I have done something similar in the past and made use of a set of buttons that add subtract from a value such as thousands of steps.

1 2 3 5 -1 -2

So 9000 would be 5, 5, -1