I can't use the scroll bar style

[Kukaina]

My system is Windows 11，I wrote this code in index.scss, but it does not take effect. Other codes written in index.scss can take effect.
`html {
scrollbar-width: thin; /* Firefox /
scrollbar-color: blue orange; / Firefox */
}

body::-webkit-scrollbar {
width: 12px;
}

body::-webkit-scrollbar-track {
background: orange;
}

body::-webkit-scrollbar-thumb {
background-color: blue;
border-radius: 20px;
border: 3px solid orange;
}`
My scrollbar still looks like this

[Skaidon]

Same issue here.

[federico-terzi]

This worked for me on Windows

body {
  scrollbar-color: hotpink blue;
}

[Natural-selection1]

But if you try all the ::-webkit-scrollbar related pseudo-classes, you'll find that it doesn't work at all

[CaseSens]

The issue stems from this code here:

html {
scrollbar-width: thin; /* Firefox /
scrollbar-color: blue orange; / Firefox */
}

Your comment syntax is broken and breaks the rest of your css.

Try removing the Firefox comments and you'll see that it works. I tested it and it worked on my Windows 11 machine.

[CaseSens]

Proof:

[MichaelCharles]

* {
  scrollbar-width: thin;
  scrollbar-color: blue orange;
}

The above isn't working for me on Mac. It'll change the width, but not the color.

[FabianLars]

webkit doesn't support scrollbar-* styles. you'll need to try it with the ::-webkit-* pseudo elements (Mdn), for example for blue orange this may work (not tried myself since i'm on windows rn)

::-webkit-scrollbar-thumb {
  background: blue;
}

::-webkit-scrollbar {
  background: orange;
}