Loading web tool...

Back

Custom Scrollbar

How to customize a scrollbar.

Close
Rotate layout Save code Display size: 0x0
Copy code
#my-div

::

-webkit-

scrollbar

{


\t

width

:

15

px

;

Note

\t

background

:

#333

;


}



#my-div

::

-webkit-

scrollbar

-thumb

{


\t

background

:

#555

;


\t

border

:

4

px

solid

#333

;

Note

\t

border-radius

:

8

px

;


}



#my-div

::

-webkit-

scrollbar

-thumb

:

hover

{

Note

\t

background

:

#777

;


}

A basic example/template demonstrating how to customize an element's scrollbar.

Element version: 1.0 (Last updated: January 26, 2024)