最近様々なサービスで黒を基調とした画面配色に切り替えられるダークモードが採用されていますよね。
CSSでは以下の指定を行うことでOSでダークモードを指定していると、サイトをダークモードに切り替えることが可能となります。
@media (prefers-color-scheme: dark) {
body {
background-color: #111;
color: #fff;
}
}
対応ブラウザは以下の通りです。
○ | ○ | ○ | × | ○ | ○ | ○ | ○ | × | ○ | ○ |
またこの記事で使用しているアイキャッチ画像は以下より作成できます。
コメントを残す