【簡単一発!】WEBサイトにおけるアクセントカラーの見つけ方

posted in: デザイン | 0

サイトにおける色選び、悩みますね。
適当に選んでしまうとサイト全体にまとまりがなくなったりしますよね。

そこで今回は、
色選びの方法をお伝えしようと思います。

まずはサイトで使用しているメインカラーの情報を用意します。
青系サイトなら青、
赤系サイトなら赤色です。

基本的に、アクセントカラーはメインカラーの保護色になります。
保護色とは、こちらの色相環の色の反対側の色のことです。

とはいえ全てサイトが原色を使用している訳ではありませんし、
その中でもトーンや、彩度など、色には複雑な要素も付きまといます。

そこで簡単に解決すべく、ご紹介するのはこちら
https://produce.rucca9.com/2020/10/07/color_tool/

こちらにアクセスして、

カラーピッカーからメインのカラーを選びます。


情報を入力したら

即カラー診断結果が。


色情報が出ました。
黄緑色#dfef6aの色がアクセントカラーです。

この状態でトーンは揃っていますので、
photoshopなどで編集する際は、トーンは変更しないようにしましょう。
トーンが変わると一気に
「保護色だけど、なんか違う。。」という状態になっちゃいます。

変えるとしたら、明るさのみOKです。
明るく/暗くで好きなように調整しましょう。

コツは少し他と比べてパキッとする程度です。
RUCCAはボタンなどでよく保護色を使用します。

いかがでしたでしょうか?
https://produce.rucca9.com/2020/10/07/color_tool/
を使って一発でアクセントカラーを選定することができました!

※rbg情報の取り方が難しい!
という方がいらしゃたら下のコメント欄にご意見いただければ
改めてご紹介致します。

宜しくお願い致します。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です