Vicunaのキーカラーを一発調整するCSSモジュール

配色の中で主要な色をグループ化し、最低限の編集でキーカラーを変更するkeyCollor.cssを試験的に作りました。一応、全てのスキンで使うことができます。

Vicunaは主要な要素(例えばリンクやボタン類など)は機能的に目立つ色にデザインされており、これにはある程度規則があるので、それらのセレクタをまとめ、数箇所色を変更するだけでアクセントとなる色を変更できるようにしたCSSファイルです。

使い方

keyCollor.cssをダウンロードし、お使いのスキンのmoduleフォルダの中に入れ、5-module.cssからimportしてください。(別にどんなやりかたでもいいけど、他のモジュールにならって)

同じようなCSSファイルにsubSkin.cssがあるのですが、もしsubSkinモジュールを使用している場合は、その一番最後にファイルの記述を書き写して調整してもいいです。

面倒くさい人はkeyCollor.cssの中身を一番最後に読み込んでいるCSSファイルの最下部にコピーペーストでも大丈夫です。

色の調整

keyCollor.cssを開いて中にグループ分けされている4つのキーカラーを調整してください。基本的に、1つのキーカラーは1色で統一してください。つまり、全部で4つの色を各キーカラーに配分します。

うまく対応できないスキン

style-altairでは、リンクの下線はkeyCollor.cssでは届きませんので、ここは直接1-element.cssを編集してください。

style-happyDaysは、全体的にピンクなので、keyCollor.cssでは届かないスタイルばかりです。keyCollor.cssで届くスタイル以外の場所は、他のCSSファイルを直接編集してください。

• Download: keyCollor.css (右クリック保存 or コピペ)