Cocoon カスタマイズ 「strike-blue」の色を変更する方法

「strike-blue」の色を変更する方法を書きます。

スタイルシートの場所

Cocoonのskinフォルダにあります。

skins\strike-blue\style.css

style.cssをVisual Studio Codeで開いて編集します。
まだインストールしていない方は下記のリンクよりダウンロードできます。

あわせて読みたい

Visual Studio Code – コード エディター | Microsoft Azure ほぼすべての言語で動作し、任意の OS で実行される強力なコード エディターである Visual Studio Code を使用して、Azure 上で編集、デバッグ、デプロイを行います。

早速開いてみましょう。

こんな感じに表示されると思います。

置換

左側に表示されている検索マークを押します。

検索窓が表示されるので#04384cと入力しましょう。
後は下の「置換」と表示されている欄に変更したい色を入力しましょう。

色はこちらのページを参考にしました。

原色大辞典

WEB色見本 原色大辞典 - HTMLカラーコード 色の名前とカラーコードが一目でわかるWEB色見本

今回はクリムゾン色(#dc143c)に変更したいと思います。

入力したらすべて置換を押します。
問題無く置換できたら保存します。

あとはサーバーにアップロードするなどして確認してみましょう。

こんな感じに変わっていたら完了です。