нормального способа оформлять range через css на данный момент не существует. мало того, что у каждого браузера свои нестандартные и несовместимые селекторы, так ещё и в вебкитах тупо нету отдельного селектора для закрашенной части рельса слева от позунка. народ для этой цели извращается с тенями, но это более или менее сносно работает только в случаях когда ширина ползунка и рельса совпадает. дополнительно осложняется это всё тем, что отдельные части рейнджа - это и так псевдоэлементы, и у них нету никаких ::before и ::after.
сейчас задача сделать такой контрол, как на этой картинке, на чистом цсс - это уровень тестового задания сеньёр веб-технологу. и в прод это выпускать будет страшно, потому что хрупко и при обновлении браузера может сломаться.
Чувак скажи что тебе конкретно надо сделать и я тебе скину готовый код, для того чтобы кастомизировать это, не нужны плагины черт бы тебя побрал, там 2 строчки кода, или даже одна
