エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
【JavaScriptとCSS変数】シンプルなダークモードの実装 - Qiita
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
【JavaScriptとCSS変数】シンプルなダークモードの実装 - Qiita
Windowsの設定などでおなじみの「ダークモード」。 背景が黒っぽく、文字が白系統になるこのモードです... Windowsの設定などでおなじみの「ダークモード」。 背景が黒っぽく、文字が白系統になるこのモードですが、CSS変数とJavaScriptを用いて作成してみました。 今後コピペして使い回したいと思ったので、最低限のシンプルな実装です。 ソースコード まず先にソースコードの紹介です。 各箇所の解説は後述します。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Light-Dark</title> <link rel="stylesheet" href="./style.css"> <script src="./index.js"></script> </hea