Создать пользовательскую полосу прокрутки с интервалом

Question

Я создал со следующей таблицей стилей:

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 14px 14px rgba(80, 75, 75, 0.295);
  border: solid 4px transparent;
}

::-webkit-scrollbar-thumb {
  box-shadow: inset 0 0 14px 14px #fff;
  border: solid 4px transparent;
  border-radius: 10px;
}

/* set button(top and bottom of the scrollbar) */
::-webkit-scrollbar-button {
  display: none;
}

пользовательская полоса прокрутки с белой дорожкой и цветным большим пальцем и некоторым расстоянием между настройками границы и тени. Это выглядит хорошо, когда фон моего текущего раздела моего dom-элемента имеет тот же цвет фона, что и мой html цвет фона. Поскольку это не всегда так, я хочу динамически устанавливать цвет фона полосы прокрутки.

Как я могу установить цвет фона от

::-webkit-scrollbar

до javascript?