Для стилизации полос прокрутки в современных браузерах можно использовать свойства scrollbar с префиксом -webkit в сочетании со стандартными свойствами ширины (scrollbar-width) и цвета (scrollbar-color). 1

В браузерах Chrome, Edge и Safari для оформления полосы прокрутки используется псевдоэлемент ::-webkit-scrollbar. 4 Например, для определения ширины всей полосы прокрутки можно установить свойство width: 12px, а для цвета зоны отслеживания — background: orange. 4 Для цвета бегунка — background-color: blue, а для отступа вокруг него — border: 3px solid orange. 4

В Firefox для стилизации полос прокрутки применяются свойства CSS Scrollbars, в частности scrollbar-width и scrollbar-color. 4 Например, чтобы создать полосу оранжевого цвета с синим бегунком, можно использовать код: body { scrollbar-width: thin; scrollbar-color: blue orange; }. 4

Также для получения кросс-браузерных стилей можно использовать плагин postcss-scrollbar, который генерирует свойства полосы прокрутки с префиксом -webkit из стандартных свойств. 1