Skip to content

Possible to pass a color and a box shadow to the scrollbar track? #569

Answered by KingSora
BenjaminHoefer asked this question in Q&A
Discussion options

You must be logged in to vote

@BenjaminHoefer Good day :)

Besides the css custom properties, you can pass add almost any style to the scrollbar, scrollbar-track or scrollbar-handle.
For example you could do this:

.os-scrollbar > .os-scrollbar-track {
  box-shadow: 0 0 5px 0px rgba(0, 0, 0, 0.75);
}

or if you need to apply different styles per scrollbar you can do:

.os-scrollbar-horizontal > .os-scrollbar-track {
  box-shadow: 0px -5px 5px 0px rgba(0, 0, 0, 0.75);
}

.os-scrollbar-vertical > .os-scrollbar-track {
  box-shadow: -5px 0px 5px 0px rgba(0, 0, 0, 0.75);
}

Here is a small example: https://stackblitz.com/edit/overlayscrollbars-xfyops?file=styles.css

Replies: 1 comment 2 replies

Comment options

You must be logged in to vote
2 replies
@BenjaminHoefer
Comment options

@KingSora
Comment options

Answer selected by BenjaminHoefer
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Category
Q&A
Labels
None yet
2 participants