MENU

当サイトはリンクフリーです

当ブログ内の記事本文や図解等は、以下の注意事項を守っていただければご自由にお使いいただいて結構です。

【注意事項】

  • 引用元として当サイト名を記載の上、対象記事へリンクしてください。
  • 添削記事などの紹介者のアイコンは転載不可です。

ご不明な点があれば、twitterのダイレクトメールまでお願い致します。

著者

どんぐり所長

Nobilista公認バッジ

愛用 順位チェックツール

オリジナルグッズ購入

有名ブロガーのお洒落なトップページ配色9選【カラーコード有り】

あなたはブログの配色にお悩みではないですか?ちょっと色を変更するだけで、サイトのイメージがガラッと変わってしまいます。

色々試してみても、どんな配色にしたらいいのか分からない…そんなときはすでに成功されている先輩ブロガーのサイトを見に行ってみましょう!もう成功されている方の配色ですから、間違いがないはず!

この記事では、有名ブロガーのトップページの配色を調べてました!しかも、オシャレな配色のサイトばかりを集めました。

カラーコードを添えてありますので、気に入った配色をあなたのブログに設定する事もできます。ぜひ、最後まで読んで、気に入った配色をお持ち帰りください。

▶︎ブログ仲間のトップページ配色の記事はこちら

目次

お洒落なトップページの配色

有名ブロガーのサイトを調べていくと、案外そっけない色合いのサイトが多いことに気がつきました。約半数のサイトはほとんど色味のないサイトでした。

やはり、稼ぐためにはデザインは関係ないのでしょうか。

とはいえ、色はサイトを印象付ける大事なファクター。私は無駄だと思いません。なぜなら、これから紹介する偉大な先人ブロガー達も色で華やかにサイトを飾っているのですから。

ヒトデブログ

ヒトデブログの配色
ヒトデブログ
ヒトデブログのトップページ

https://hitodeblog.com/

  • テーマ:JIN

言わずと知れた、ヒトデさんの運営するブログ初心者向けの始め方ブログ。優しい色あいに思いがちだが、意外に渋めの色合いの組み合わせ。

サルワカ

サルワカの配色
サルワカ
サルワカのトップページ

https://saruwakakun.com/

  • テーマ:xeory_base

サルワカの配色は、渋めのカラーにオレンジと水色を組み合わせた。どの色も少し彩度を落としてくすんだような色合いにしている。

ぽんひろ.com

ぽんひろ.comの配色
ぽんひろ.com
ぽんひろ.comのトップページ

https://ponhiro.com/

  • テーマ:Cocoon

デザインカスタマイズで有名なぽんひろさんのサイトは、ビビットな色使いで明るい印象に。オレンジを主体にまとめています。

副業コンパス

副業コンパスの配色
副業コンパス
副業コンパスのトップページ

https://tabinvest.net/

  • テーマ:SANGO

クニトミさんが運営する副業コンパス。以前はもう少し暖かい印象のサイトでしたが、少しクールな印象のサイトにリニューアルされました。青系で統一して真面目で爽やかな印象。

マクリン

マクリンの配色
マクリン
マクリンのトップページ

マクリンのページへ

  • テーマ:SANGO

オンラインコミュニティ「マクサンラボ」を運営するマクリンさんのサイト。独特の少し緑の入った青とイエローの組み合わせが特徴的。この色だけで、あぁ、マクリンだなとわかる。

ノマド的節約術

ノマド的節約術の配色
ノマド的節約術
ノマド的節約術のトップページ

https://nomad-saving.com/

  • テーマ:n20

女性をターゲットにしたサイトでは柔らかい色がよく似合う。優しい緑色に渋いオレンジの組み合わせ。基本彩度を落としくすんだ色にして使うことで柔らかい印象にしている。

ブログ部

ブログ部の配色
ブログ部
ブログ部のトップページ

https://makusan.jp/blog/

  • テーマ:SWELL

オンラインコミュニティ「マクサンラボ」を運営するサンツォさんのサイト。彩度を落としたくすんだ色を使うサイトが多い中、ビビットな赤色を使うのが特徴的。

ブログ部は2022年7月に「マクサン」として生まれ変わりました。旧「ブログ部」もとてもお洒落な配色でしたので、そのまま残したいと思います。

manablog

manablogの配色
マナブログ
manablogのトップページ

https://manablog.org/

  • テーマ:manabu

ブログから海外移住まで成功したマナブさんのサイト。テーマは独自テーマ。配色はモノトーン。manablogを参考にしたサイトが多いため、ガジェット系やブログ系、情報系は似たような色合いのサイトが多い。

クロネのブログ講座

クロネのブログ講座の配色
クロネのブログ講座
クロネのブログ講座のトップページ

https://kurone43.com/

  • テーマ:JIN

私のブログの師匠(勝手に思っているだけ)クロネさんのサイト。なんと2022年5月末で閉鎖予定。寂しい。継続決定!色合いは赤と黄色で攻めながらも、くすんだ紺が渋くて落ち着きをもたらしている。

色の設定がしやすいテーマはSWELL

いろんな色を試してみたい。そんな要望に簡単に答えるwordpressテーマが「SWELL」。

カスタマイザーを見ながら、リアルタイムで色を試していくことができます。

SWELLのカスタマイザーメニュー

例えばヘッダーなら下の写真のように、色を変えたらすぐ画面で確認できちゃいます。

どんぐり所長
どんぐり所長

もう、SWELLなしではブログ運営していけなくなりました(汗)

\カスタマイザーで簡単設定/

ブログ配色に関するQ&A

他人のサイトの配色を真似して怒られませんか?

大丈夫です。記事の内容やタイトルをそのまま真似することはしてはいけませんが、配色を参考にするのは問題ありません。

色をたくさん使えば目立っていいですよね?

色は絞りましょう。メインカラーとベースカラー、アクセントカラーの3色に加えて白・黒・グレーまでに抑えるのがよいです。

気に入った色がみつかったけど、色番号の取り方がわかりません。

Google chromeの拡張機能で「Colorpick Eyedropper」という便利なアドオンがあります。こちらを使えば、あなたの画面に表示されている色番号を取得することができるようになります。

有名ブロガーのトップページは素敵だった

「ブログで稼ぐのにデザインは関係ない」。そんなことはありませんでしたね!やはり、伸びている先人たちのサイトはお洒落でした。

そんな、有名ブロガーたちの配色を真似してみれば、あなたのサイトも爆伸びしちゃうかも!?ぜひ、この配色を参考に、あなただけの配色をみつけてくださいね。

▶︎ブログ仲間のトップページ配色の記事はこちら

推奨ザインツール

当サイトでは、無料でもオシャレなデザインが簡単に作成できる、「 Canva 」を推奨しています。無料でも相当なレベルのデザインができるのですが、一度PROにすると無料には戻れなくなってしまいました。その秘密は、下記の記事に。

Canvaを詳しく知る

おすすめWordpressテーマ

私は、導入するだけで一気にお洒落になるWordpressテーマ「SWELL」をおすすめします。デザイン性はもちろん、その操作性は特筆ものです。

SWELLを愛用する私が実際に使用してきた内容を加えた、詳しい記事を書いています。ぜひご参照ください。

SWELLを詳しく知る

トップページへ戻る

お気軽にコメントください

コメントする

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

目次