How to make such a range slider (different distance between points)?

Question

Layout

The problem is the following - I can't figure out how to make such a range slider:


There should be 4 points, but they are at different distances from each other, that's the problem.
I found a bunch of plugins for this element, but everywhere the distance between the points is the same.

In addition to the option to write your bike, who will tell you other options?

Answer 1

If you see a slider in front of you ( [type="range"]), then it is not necessary to make it using this type of field. You can take a group of radio switches, and then make any design you like.