黒、白、グレーの控えめでエレガントなウェブデザインを鑑賞

クラシックな色の組み合わせの中でも、黒、白、グレーの時代を超えた魅力を否定できる人はおそらくいないでしょう。人々は常に「目立つ」こと、注目を集めること、注目を集めることを望んでいますが、ユーザーを永遠に引き留めたいのであれば、第一印象に加えて、今後はあらゆる面でより詳細な情報が必要になります。さらに、私たちの周りにはすでにあまりにも多くの色が爆発しており、私たちの色認識システムはピークに達している可能性があり、私たちは常に作業を止めたいと思っています。この時、黒、白、グレーの色の組み合わせは、多数の色の中から際立っており、人々の心を落ち着かせることさえできます。これは、過去2年間でミニマリストスタイルが流行した理由でもあります。

以下は、編集者が選んだ黒、白、グレーのカラーマッチング Web サイト 13 件です。Web ページをデザインする際のカラー スタイルの参考にしてください。

1. アリスト

インテリアデザイン会社は、伝えるデザイン哲学と密接に関連して、黒、白、金をメインカラーとして使用しています。ページ構造はシンプルでクリーン、そしてミニマルです。ホームページの写真は色彩を削ぎ落として、控えめなグレートーンのみにし、その他の補助色も控えめで抑制されたままにすることで、別の種類の高級感を強調しています。

2. 基本

黒、白、グレーを色の組み合わせとして使用し、他の明るい色調をごく少量使用することは、黒、白、グレーの色の組み合わせの秘訣の 1 つです。ただし、全体の構成では、静けさと冷たさの中にある躍動感を表現するために、より多くのスペースが必要です。このウェブサイトのデザインはこのレシピに従っていますが、画像を少し複雑にするために他の画像の色を追加しています。

3. カレンス

中央にはランダムに重ねられた2枚の絵が配置され、想像の余地を残す十分な余白と、慎重な色使いが、まさに高級ブランドの雰囲気を感じさせます。

4. 流木版

独立系の小さな出版社で、完成品は白黒で、ウェブサイト全体も白黒なので、雰囲気が厳粛になりすぎています。しかし、出版業界の白黒コピーのような質感を反映することもあります。

5. デザインが埋め込まれている

作品の詳細を全画面で大きく表示するWebサイトの場合、黒、白、グレーしか選択肢がないように思えますが、同時にデザイナーは赤も配置しました。大きな画像表示のインタラクションはとても巧妙です。黒はクールでダークな雰囲気を伝え、細部の輝きを強調します。

6. エコー

このページでは白黒の線が使用されており、壮大に見えますが、簡単に人々に眩しい効果を与えることができます。プルダウンの紹介では、テキストは白黒で表示され、ポイントするとカラーで表示されます。好ましい縦線は、人物に使用するとモダンでファッショナブルな雰囲気を与えます。

7. 固定する

ホームページ全体では、黒の線のベクトル グラフィックを使用して、濃密でカラフルな画像を形成し、デザインの独創性を際立たせています。フォントもこれにマッチしており、サイト全体のデザイン性も高く、アニメーション効果も適切に施されており、一流の作品となっています。

8. 関数

住宅設計会社のウェブサイトでは、テーマは依然としてコンテンツに委ねられ、住宅設計そのものが語られるようにしています。黒と白の配色をベースに、木製の家庭用家具を連想させる木製のクリームイエローと組み合わせ、落ち着いた明るい雰囲気を演出します。

9. ハントリー

インテリアデザインスタジオは、人々に空間感覚を与えるために白をメインカラーとして使用し、ホームページの表現と自己イメージのパッケージングは​​スムーズで簡潔に見えます。シンプルな白黒の配色に、アクセントカラーとして明るい黄色が含まれており、Web サイト全体がより生き生きと鮮やかに見えます。

10. ジョンソン、B.C.

これは科学者ジョンソン B.C. の個人ブログです。背景には彼の科学研究分野の自然の写真が使われており、配色は暗く、厳格さ、神秘性、クールさの印象を強調しています。

11. シリアルを読む

灰色の背景のウェブサイトは全体の雰囲気を鈍くしますが、同じ色の高品質の写真と組み合わせると非常にエレガントな感じがします。

12. タオスタジオ

ベージュピンクのベースカラーを使用することで、従来の黒、白、グレーのウェブサイトとは異なり、温かみのある雰囲気が伝わります。ホームページのサムネイルの配置とデザインは非常に新鮮で統一されています。シンプルな線画がちょうどいいです。

13. ヴィンスフロスト

画面全体を埋め尽くす大きな白黒画像、大きなテキスト、没入感のあるナビゲーションとコンテンツ。マウスを乗せると若干色が変わります。ウェブサイト全体の構造が明確で、操作がスムーズです。