CSS - scrollbar-color

• トップ
• CSSリファレンス
• scrollbar-color

概要

説明

スクロールバーの色を指定します。現時点(2024年11月)では Safari でまだサポートされていません。

auto

ブラウザのデフォルトにまかせます。

<thumb-color>

スクロールバーのつまみ(動かすところ)の色を指定します。

<track-color>

スクロールバーのトラック(溝のところ)の色を指定します。

使用例

.my-box {
  width: 10rem;
  height: 6rem;
  border: 1px solid #999;
  overflow: scroll;
  scrollbar-color: #99f #fcc;
}

<pre class="my-box">
AAA
BBB
CCC
DDD
EEE
FFF
GGG
</pre>

AAA
BBB
CCC
DDD
EEE
FFF
GGG

関連項目

リンク

• https://developer.mozilla.org/ja/docs/Web/CSS/scrollbar-color
• https://drafts.csswg.org/css-scrollbars/#scrollbar-color
• https://caniuse.com/mdn-css_properties_scrollbar-color