Home > Software design >  How do I change color of Scrollbar in Visual Studio Code?
How do I change color of Scrollbar in Visual Studio Code?

Time:08-16

The question is - how do I change color of scrollbar in VSCode?

I want to change my scrollbar to the color of my VSCode background. Available scrollbar settings in workbench.colorCustomizations don't change it the way I want (all I could find is scrollBarSlider and scrollbar.shadow settings), and I know there's a way to change it cause it is different in other themes (it's the same color as the background in those themes, as it should be)

How my scrollbar looks right now

(Added an arrow juuuuuust incase)

Thanks a lot!

CodePudding user response:

In your settings.json:

"workbench.colorCustomizations": {
    "editorOverviewRuler.background": "#ff0000",  // for the "track" where the scrollThumb lives
    "scrollbarSlider.background": "#9aa",  // for the scrollThumb color
}

For others, see theme color reference: scrollbars and editorOverViewRuler in the same link.

Do note that there are other indicators that also live in the editorOverviewRuler, like selection indicators, find match indicators and more, which have to play nice with the color as well.

  • Related