1. TOP
  2. Web技術
  3. 色の組み合わせ(2色、3色)

色の組み合わせ(2色、3色)

Web技術
  1,082 Views

琉海です。

デザイナーさんに発注すれば、ハイセンスで素敵なものを作ってくれるわけですが、起業しようかっていう段階では、自分で作らないといけませんね。

そんなとき、色選びがとっても大事です。

誰かのブログを見るときに、どこか(ダサい・・・)感じがするときは、気持ち悪い色の組み合わせをしていることが原因です。
つまり、色選びのセオリーを知らずに、適当に好きな色を選ぶからそうなっちゃんですよね。

デザインセンスは、持って生まれたものもあるので、より磨く!っていうのは、なかなか難しいのですが
センスのいい色選びは、誰にでも、簡単にできます。

色選び、特に「色の組み合わせ」を間違わなければ、センスよく見えるようになるってこと。

田舎くさい印象付けをしたいのであれば、気持ち悪い色の組み合わせでもいいのですが、せっかくですから、スタイリッシュにかっこよく!見せられる色を選びましょう。

センスがいい色の組み合わせの見つけ方

もともと、オレンジx紫x緑の組み合わせが好きなので、これを基本にしています。

3_4_color_select
ファッションでも同じなのですが、全体を3色以内におさめるとスタイリッシュに見えるようになります。あとは、白と黒、グレーと組み合わせますよ。

まずですね、メインカラーを決めます。
ブランドカラーを決めておくと、いいですね。

たとえば、

三井住友銀行

みずほ銀行

東京三菱UFJ銀行

ティファニー

他にも、ローソンやファミリーマート
イオンやセブンアンドアイとかも、統一カラーを使ってますよね。

今後のことも考えて、ざっくりでいいのでメインカラーを設定しておくと、ブランドのズレがなくなりますよ。

さてさて、私の場合は、このオレンジ色をメインカラーにします。

#FEBD69

RGBカラーの番号です。
これはね、赤(R)2桁、緑(G)2桁、青(B)2桁で表現されています。
つまりは、光の三原色ってこと。

この色番号はね、無料ソフトを使うと、すぐにわかります。

わたしがよく使ってるのは、カラーピッカー(Color Picker)っていう無料ソフトです。

http://www.vector.co.jp/soft/win95/art/se350616.html

※windows専用

インストールは必要なくて、ソフトを起動したらすぐ使えます。

色番号が知りたいところに、マウスカーソルをあてて、クリックするとクリップボードに番号が記録されているので、これを使います。

・・・続きは、動画でどうぞ

色の基本
http://www.lifehacker.jp/2014/08/140817color.html

ColorPicker(RGBカラーを調べる無料ツール)
http://www.vector.co.jp/soft/win95/art/se350616.html

2色、3色の組み合わせを調べるには? ※おすすめ!
http://www.colorhexa.com/

すてきな配色探しなら、以下2サイト
http://www.colourlovers.com/

https://www.instagram.com/coolors_co/

\ SNSでシェアしよう! /

週刊モテブロの注目記事を受け取ろう

この記事が気に入ったら
いいね!しよう

週刊モテブロの人気記事をお届けします。

  • 気に入ったらブックマーク! このエントリーをはてなブックマークに追加
  • フォローしよう!

ライター紹介 ライター一覧

週刊モテブロ編集部

この人が書いた記事  記事一覧

  • 【アメブロ】リブログのすべて

  • WPで作ったサイトにアクセスすると勝手にURL転送される

  • LINE@友達の解除方法【2018年最新版】

  • iCloud.comにメールが届かない

関連記事

  • movをwmvに変換したいときの方法(windows編)

  • a.karmagist.club(マルウェア)に感染した話

  • Photoshopで画像解像度にピクセルが選べないとき

  • ThunderBirdで送信できないとき

  • 「新しいタブ/ウィンドウで開く」の罠

  • 文字化け(?)したエラーメッセージが読みたいとき