もう1サイト作る気持ちでダークモードを作った

2026/05/24

ずっと踏み切れなかった

ダークモード。最近はどのサイトも取り入れられていることが多いですよね。なので、このブログでも取り入れようかと何度か悩みました。しかし、その度に思うのです。

今のこの状態の雰囲気が好きだ！

このブログサイトの思想である「シンプルで触り心地の良い」がぶれてしまうのではないか。そんな葛藤があり、なかなかダークモードの採用に踏み切れないでいました。画面を真っ暗にするあの感じと、ブランドカラーのミスマッチ感が、どうしても許せなかったんですよね。

でも、ダークモード、取り入れてみたい…。

そこで、もう一つのブログサイトを作る気持ちで、色を決め直すことを決意しました。

このサイトは、シンプルに次の2色がメインで構成されています。

--brand   /* キーとなるカラー */
--bg      /* 背景色 */

ライトモード（既存）では、この二つだけで綺麗に色が映えていました。

ところが、ダークモードにした途端に破綻しました。視認性が悪かったり、色が映えなかったりしたのです。

そこで、要素ごとに「どの色がいいか」を考え始めました。

……ですが、考えれば考えるほど、ダークモードだけ色が増えていく。気づけば、当初の「2色」という構成から離れてしまっていました。

そこで、基本に立ち返りました。あらためて2色に絞り込む。

brandカラーは淡い青色を基調としながら、全体的に茶色を纏わせて、紙のような雰囲気をもたせる。そうしてできたのが、今のダークモードです。

ライトモード（既存）が自分の中で完成品だったので、どうしてもダークモードに手を出すことができないでいました。

けれど、「新しいブログサイトを作るノリ」でダークモードを作れば、うまくいきました、というお話でした。