その他運営サイトはコチラ▷link lit

【ブログのテーマカラーの決め方】イメージカラーで綺麗なデザインを

こんな人にオススメ
  • ブログのテーマカラーに悩んでいる
  • デザインがうまくいかない
  • 使うべき色の参考が欲しい

色にはそれぞれ「印象」を持っています

  • やけど注意 危険 冷房
  • やけど注意 危険 冷房

このように文字に色をつけることによって

内容を直感的に理解することができるようになります

今回は色の印象を考えながら「色相」「彩度・明度」の観点で


ブログのテーマやデザインについて
考えていきたいと思います

Contents

色のイメージを上手に使う

色相

色は3つの属性によって構成されています
画像に alt 属性が指定されていません。ファイル名: 8b232299faf2d15f457718775fd61980.png
  • 色相
  • 彩度
  • 明度


「色相」「彩度」「明度」を掛け合わせることによって「」が決まってきます


主に使われる色のイメージ
  • 赤色のイメージ
    • 高温、情熱
  • 黄色のイメージ
    • 注意、明るい
  • 緑色のイメージ
    • 安全、平和
  • 青色のイメージ
    • 集中、低温

この4色はよく使うので
覚えておくといいです



イメージカラーの特性を上手に使うことで
内容の理解度が大きく変わってきます

色の濃さもイメージに影響します
<例>
・今日は暖かい
・今日は暖かい

色のイメージを利用して、ブログのテーマカラーを決めていきましょう

ブログのテーマカラーの選び方

ブログのテーマを選ぶには

  • ベースカラー
    • 背景の色
  • メインカラー
    • 見出しやボックスの
      テーマカラー
  • アクセントカラー
    • 特に強調させたい箇所に使う色


この3色を決めましょう!

3色に収めることで、シンプルな構成を作ることができます

ベースカラー、背景の色は白・グレーが基本です

その他の「メインカラー」と「アクセントカラー」を決めていきましょう

配色の割合

配色の割合は

ベースカラー・・・70%
メインカラー・・・25%
アクセントカラー・・・5%

の割合で構成することをオススメします

この割合で使うことで
全体的にバランスの取れた整った印象になります

ブログのテーマだけでなく、ブロックを使用時も心がけることも大切です!

色の決め方

色を決めるときには「色相環」を利用します

先ほども紹介しましたが、色にはイメージがあります

ブログのテーマに合った色の印象を利用すると効果的です

<例>
  • レビュー系記事
    • 信頼性を与えるために青色
  • 植物系の記事
    • 自然や穏やかさを利用する緑色
ツタロー
ツタロー

メインカラーは決まった!
アクセントカラーはどうしていけばいい?



アクセントカラーは「色相環」の反対側の色を利用します

STEP
メインカラーを決める

色相環の中でメインカラーを選ぶ

色の印象も考慮しよう!

STEP
アクセントカラーを決める

メインカラーで選んだ色の
反対側の色を利用すると整った印象となります

メインカラーをにしたときは、アクセントカラーを黄色付近の色を利用するとバランスが取れます

ヒトデさんもこのように
オレンジの反対側に位置するを利用しています

関連記事▷頑張れば必ず報われる「凡人くんの人生革命」を読んだ感想

目が疲れない色

明度・彩度

コントラストの強い色は避けよう!

コントラストとは

コントラストは
「明度」「彩度」が強い色を表す

コントラストが強いと眩しく感じてしまい、読みにくい」印象を与えてしまいます

真っ白」「真っ黒」はベストな色ではありません

|色を使うときは「少しくすませる」ことがポイントです


くすませることで目に優しい色になり

きつい印象⇨柔らかい印象となります

デザイン的にもセンスの良い配色に見られやすくなります



「明度」や「彩度」の高い色

すなわち、「原色」を利用してしまうと
眩しく感じてしまい、読み手の目が疲れてしまいます

原色は強調や目立たせたい
ワンポイントで使うと効果的です

オススメの色

ツタローjr.

結局どの色を使えばいいんだろう…

目に優しくて、よく使われている色はパステルカラーです

パステルカラー

パステルに使われる
中間色で白みかかった淡い色


原色に白を足した淡い色を使うことで
読み手が不快と思わない印象となります

画像に alt 属性が指定されていません。ファイル名: 95e69de7c0c38c66431471d7b3a337cb.png

原色とパステルカラーと比較すると

原色はコントラストが強く長時間見ることによって、不快感がどんどん増していきます

それに対してパステルカラーは
目に優しい色のため、ずっと見ていても
不快に感じることはありません


その他パステルカラーはこちらから

コントラストを抑えることで、目が疲れないデザインを作ることができます

まとめ

  • 色合いを決めるときは「色相環
  • 原色は強調のときに使う
  • 色を使うときはパステルカラーを利用

メインカラーは少しくすませて、アクセントカラーは原色がオススメです


基本的な色をくすませることにより、原色を使うことでより強調ができます


色のイメージを巧みに利用することによって、瞬間的に理解をすることができます


他にも、ブログのテーマカラーは


を利用することで「信頼」や「親しみ」を、「明るい印象」を与えたい人はオレンジ


テーマカラーによってイメージが大きく変わってきますのでぜひ試してみてください


色を上手に利用して相手にわかりやすく伝えましょう!

それでは〜!

コメント

コメントする

CAPTCHA


Contents
閉じる