こんにちは。私の記事を見てくれてありがとう。今回はライト、ダークモードを適用したので紹介する。

ライトモード、ダークモードとは

知っている人も多いと思うが、最新のスマホ、PCにはライトモードとダークモードが存在する。今回はそのデザインを適用した。

ライトモードはいつもの白ベースのデザインで、明るい。対してダークモードは全体的に暗く、目に優しいのが特徴。

手動設定可能なアイコンも装備

ヘッダーの部分に太陽または月のアイコンがある（もしかしたら反映されてないかも）と思うが、ここでもまたカスタムが可能だ。

CSS、またはJavascriptで可能

詳しくは自分でググってほしいが、今回のデザインはCSS, またはJavascriptで作ることが可能だ。CSSの場合、

@media (prefers-color-scheme: dark) {
body {
background-color: #000;
color: #fff;
}
}


@media(refers-color-scheme: dark){中にcssコードを書く} と書くことで、端末がダークモードだった際にデザインを適用することができる。

今後の目標

今後はもう少しパスの設定を整えたい。index.html以外の記事は別のフォルダにまとめているから、パスの設定がそれによりバラバラである。そこを次回までに改善するつもり。

また、今のダークモードだと、他の記事に飛んだときに設定がリセットされてしまう。そこもなんとかしようと思う。