How can I design the input of range by CSS?

Question

I wanna learn the design <input type="range"/> by CSS.
I have some workings in the past for design the input of range by another thing .
Here👇👇👇
https://code.sololearn.com/W81yRIgYc4I1/?ref=app
It's became beautiful ,I want to create thing alone by CSS.

Answer 1

CSS only:
https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/
Other relevant articles (not CSS only):
https://css-tricks.com/value-bubbles-for-range-inputs/
https://css-tricks.com/custom-interactive-range-inputs/
https://css-tricks.com/sliding-nightmare-understanding-range-input/
I hope these help! 😊

Answer 2

Thanks so much