WebGallery

Webデザインの初心者がスマートフォン対応しているWebサイトを淡々と紹介していくサイトギャラリーです。

*

ピンクのグラデーションが綺麗!なサイト3選

   

数年前からWebデザインのトレンドとして様々な所で取り上げられていますが、背景に使用したりボタンや電話番号などアクセントとして使用したり写真の上に重ねたりと、様々な使い方があって見ていてとても楽しいです!

今回は、その中でもピンク系のグラデーションを使ったサイトを3つご紹介したいと思います。

FORH

ヒーローヘッダーの動画の上にグラデーションを重ねたり、メニュー部分の背景やタイトル部分がグラデーションになっていたりと、色んな要素にグラデーションを使用しています。
サイト全体に統一感が生まれ、かといってクドすぎない絶妙なバランスでグラデーションを取り入れていて、とても参考になるデザインのサイトです!

 

andMade

こちらは見える箇所にグラデーションを使うのではなく、ホバーアクションにグラデーションを取り入れています。
サイト全体の配色は白と黒のシンプルなものにして、ホバーしたときに色を出す形になっているので、写真の鮮やかさが際立っていますね!

 

ELI

こちらは青とピンクの淡いグラデーションを使った柔らかい色合いのサイトになっています。
ファーストビューの男性の肌や唇の色に合わせたグラデーションになっていて、配色に統一感が出ています。

 

パキッとしたグラデーションが多い中、ピンク系の淡いグラデーションを使ったサイトが多く、優しく柔らかい印象が伝わってくるサイトが多いですね。

web上で簡単に綺麗なグラデーションを作れる「shade」や「uiGradients」といったジェネレーターもあるので、活用していきたいですね!

 - 色で表現 , ,

  関連記事

アニメーションをたくさん使ったヨットハーバーのサイトが面白い!

兵庫県西宮市にあるヨットハーバー「Shin Nishinomiya Yacht …

足跡がついたり模様を雲に見立てて動かしたりと、動きをつけて楽しい雰囲気の「雪丸散歩」

奈良県王寺町公式サイトの「雪丸散歩」のホームページです。 聖徳太子のペット「雪丸 …

商品のイメージカラーの黄色を全面に出した、日焼け止めの商品ブランドのランディングページ3選!

日焼け止めが活躍する時期になりましたねー! ですが暑かったり寒かったりで気温がな …

タグで切り替えて表示することで2ページ分の情報を1ページに収める

北海道河東郡音更町にある十勝川温泉の魅力を紹介する「潤い十勝川」のホームページで …

次の世代のために美味しい野菜を作っている農家さん

茨城県つくば市で、農薬を使用しない野菜を作っている農園「子供たちの未来農園」のホ …

花が咲いたような笑顔になれる歯医者さん

広島県福山市にある歯科医院「はなえみ歯科」のホームページです。 「はなえみ」とい …

鮮やかな色だけど安心感のある自動車販売店

自動車販売店「Big Wave(ビッグウェーブ)」のホームページです。 パッと見 …

緑を使ったデザイン

  千葉県にある整骨院のサイトです。左側にグローバルナビを配置している …

kissとの出会いでショールームのようなお部屋に

愛媛県松山市にあるインテリアコーディネートショップ「kiss」のホームページです …

様々な情報が各ブロックごとに色んな大きさで並んだレイアウト

長野県小谷村の観光公式サイトです。 左側にアイコンが縦に並んだメニュー欄、右側に …