Advertisement

25beigewebsite

 

ウェブデザインにおいてよく使われている色のひとつは、ベージュを中心としたナチュラルカラーです。

主に紙テクスチャやグランジスタイルなどと一緒に使うことで、さらに自然な風合いに仕上げたホームページ、ブログなども見かけるようになっています。

 

このベージュ色を使うことのメリットとして、ナチュラルで中性的なイメージからどんなデザインにも合わせやすいという点があります。

今回はNettuts+で、ベージュ色を使ったやさしい印象のウェブサイト25個をまとめた「Colorful Inspiration : WOnderful Uses of Beige」が公開されていたので、ご紹介します。

 

どのウェブサイトもデザイン性にすぐれたクリエイティブな発想を感じさせてくれるものばかりとなっており、アイデアの参考としてみていただくとよいかもしれません。

 

 

 

詳細は以下から。

 

 

ナチュラルカラーを使ったウェブサイトデザインまとめ


 

 

The Theme Foundry

WordPressのテンプレートを制作、販売しているウェブサイトのひとつ。

かすかなグランジ風の紙テクスチャを重ねることで、ナチュラルな仕上がりとなっています。

目にもやさしく親近感の沸くデザインではないでしょうか。

thethemefoundry

 

 

All For Design

色あせた紙テクスチャを使い、そこに水彩画風デザインを加えたデザインが好印象。

緑色がよいアクセントカラーになっています。

allfordesign

 

 

TrueDesign

型押しプレス風ロゴと背景色のバランスがとてもよく、参考になる配色としてメモ。

truedesign

 

 

Eighty Two Design

ベージュを使った人気デザインのひとつはやはりレトロデザインではないでしょうか。

こちらも配色の参考になりそうなのでメモ。

eightytwodesign

 

 

Infinitum

ざらざらした質感のノイズテクスチャを背景に使うことで、自然なぬくもりのあるイメージを与えることができそうです。

infinitum

 

 

I am Docto

テキスト以外はロゴと簡単な円形シェイプのみのミニマルなウェブデザインのひとつ。

背景にベージュを使う場合、テキストも真っ黒ではなく灰色などを使うとよさそうですね。

iamdocto

 

 

Tenth Time.com

ベージュ色は企業用サイトなどでもよく使われており、エレガントな印象を与えてくれます。

こちらのサイトでは、オーナメント風のベクターデザインを淡くグラデーションを使って重ねた魅力的なデザインを使っています。

tenthtime

 

 

Make Film Work

ベージュ色にほんの少しのグランジスタイルを加えるだけで、自然な質感を演出してくれます。

makefilmwork

 

 

Pixelcraft

余白スペースをたっぷり使うことで、とても見やすいデザインに仕上がっています。

アイコンなどでデザインにスパイスを加えてみるとよいでしょう。

pixelcraft

 

 

Simon Collison

グリッドを使い等間隔に4分割したデザインが分かりやすいウェブサイトのひとつ。

ボックス枠を統一することで、ユーザーに直感的なサービスを提供できるかもしれません。

simoncollison

 

 

Noora Katto

イラストをヘッダー部分に大きく利用することで、アート性を高めオリジナリティーを出すことが可能です。

ヘッダー部分に大きくレイアウトされたイラストがインパクトがあり、一度訪れたら忘れそうにありません。

noorakatto 

 

Grafikas

ウィンドウ幅に応じてレイアウトが変化するリキッドタイプのウェブデザインを使っています。

配色もベージュを基調に色の濃淡を変化させるだけですが、とてもオシャレに仕上がります。

grafikas 

 

One Twenty Six

水平方向にカーソルを動かすユニークなデザインとなっており、本物そっくりの紙テクスチャを使ったデザインはインパクトがあります。

onetwentysix

 

 

Carol Rivello

ナチュラルなベージュ色には緑やオレンジといったカラフルな色合いがよいアクセントカラーになります。

手書き風デザインをかわいくレイアウトし、やさしい質感を表現しています。

carolrivello

 

 

People 82

こちらも緑、オレンジの配色を使ったデザインのひとつ。

親しみやすいデザインを作成したいときに参考になるかもしれません。

people82

 

 

Christopher Barrett

写真をメインに紹介しているポートフォリオサイトなどにおいてもデザインの邪魔をしない色としてベージュ色は使われているのをよく見かけます。

christopherbarrett

 

 

Mutt Ink

グランジスタイルのノート風デザインを背景に利用したウェブサイトのひとつ。

淡い質感を出したいときに参考にしてみるとよいかもしれませんね。

muttink

 

 

Sprocket House

ビンテージ風デザインなどにおいても、古びた紙テクスチャにベージュ色は利用されています。

sprockethouse

 

色別にさまざまなウェブサイトデザインを見ているだけでもアイデアの参考になりそうですね。

これまでには茶色をベースにしたウェブサイトをまとめたエントリーを公開していますので、エレガントなデザインがお好みの方は参考にしていただくとよいかもしれません。

 

茶色を使ったシンプル、エレガントなウェブサイトデザイン50個まとめ

50brownwebsite

 

参照元サイトにも今回紹介した以外の参考になるウェブサイトがたくさんまとめられていますので、こちらもよろしかったら一緒にどうぞ。

 

[参照元 : Color Inspiration : Wonderful Uses of Beige – Nettuts+]