MATEREATE CONTENTS

背景色が変化するナビのデザインイメージ
グローバルナビ

左側からバーが現れて背景色が変化するナビゲーション

メニュー項目にマウスを置くと、左側からバーが出現し、背景色が変化するナビゲーションの無料Webデザイン素材です。CSSのみで表現していますので、Webパフォーマンスにも優しいデザイン素材となっております。シンプルながらもおしゃれなエフェクトによりサイト訪問者の目を引くことができると思います。

エフェクトサイドナビのデザイン
サイドナビ

メニュー項目をオシャレに演出するサイドメニュー

クリックでメニュー項目が出現し、ホバーエフェクトでメニュー項目をオシャレに演出するサイドメニューの無料Web素材です。マウスを置くと、メニュー名が少し右に動き、下部分にラインが出現します。選択しようとしている項目が、視覚的に分かりやすくなるため、各ページへのアクセス率を上げることができると思います。

アコーディオンフルスクリーンナビのデザイン
フルスクリーン

シンプルなアコーディオン形式のフルスクリーンナビ

項目をホバーするとアコーディオン形式でエフェクトがかかるフルスクリーンナビの無料Web素材です。項目のテキストを90度傾けたデザインにし、マウスを置くとホバーエフェクトによりテキストが回転するデザインとなっております。とても印象的なエフェクトでインパクトのあるフルスクリーンナビ素材となっております。

キューブ状に回転するメニューのデザイン
グローバルナビ

項目がキューブ状に回転しながら色が変化するメニュー

ホバーエフェクトによりメニュー項目がキューブ状に回転し、背景の色が変化するナビゲーションの無料Web素材です。立体的に回転するオシャレなエフェクトにより、アクセントの効いたナビゲーションとなっております。思わずクリックしたくなるようなナビゲーションでページアクセス率を上げることができると思います。

ドロップダウンメニューのデザインイメージ
ドロップダウン

マウスホバーで背景色が変わるドロップダウンメニュー

マウスホバー時に項目の背景の色が変化し、サブ項目が出現するドロップダウンメニューの無料Web素材です。サブ項目があるメニュー項目には「+」を表示してあります。サブ項目をホバー時にも、同様に背景が変化します。たくさんの項目がある中で、選ぼうとしている項目が分かりやすいナビゲーション素材となっております。

ナビゲーションのデザインイメージ
グローバルナビ

フェードインで出現し項目名が変化するメニュー

項目をホバーすると文字がフェードインしながら出現し、項目名が変わるナビゲーションの無料Web素材です。メニュー項目に簡単な説明やキャッチコピーを入れることができ、サイト訪問者のアクセス率をより高めることができると思います。オシャレに出現するため、アクセントを効いているナビゲーション素材となっております。

ナビ素材の全てのデザインイメージ
グローバルナビ

ホバー項目以外の項目がぼやけて表示されるメニュー

メニュー項目にマウスを置くと、それ以外の項目が薄くぼやけるようなエフェクトがかかるナビゲーションの無料Web素材です。CSSのホバーエフェクトを使用し表現しています。ぼんやりと薄くなるエフェクトでサイト訪問者に優しい印象を与えることができます。

サイドナビのデザインイメージ
サイドナビ

オシャレなアニメーションで出現するサイドメニュー

アイコンをクリックするとオシャレなアニメーションで出現するするサイドメニューの無料Web素材です。左側から単に出現するのではなく、左上部分から斜めにシュッと出現するようなアニメーションとなっております。サイトのメニュー(またはサブメニュー)をオシャレに演出いたします。

フルスクリーンナビの全てのデザイン
フルスクリーン

ホバーしている項目が濃く表示されるフルスクリーンナビ

メニュー項目をホバーすると、ホバーしている項目が濃く表示されるナビゲーションの無料Web素材です。CSSのホバーエフェクトのみで表現しています。マウスが乗っていない項目が薄く表示されるため、どの項目を選んでいるのかがわかりやすくなります。フルスクリーン表示の見やすいナビゲーション素材です。

グローバルナビ素材の全てのデザインイメージ
グローバルナビ

メニュー項目の上下部分にラインが現れるメニュー

メニュー項目をホバーで、項目の上下部分に左右からラインが出現するナビゲーションの無料Web素材です。レスポンシブ対応なので、タブレット、スマホでもご使用可能となっております。シンプルながらもちょっとしたアクセントが欲しい…。そんなナビゲーションのWeb素材となっております。

サイドナビ素材の全てのデザインイメージ
サイドナビ

クリックで画面左からスライドして現れるサイドメニュー

必要な時に応じて画面に呼び出せるサイドメニュー素材です。メニューアイコンをクリックすると、画面左からメニュー項目が現れます。ホバーエフェクト等のアニメーションは加えておらずとてもシンプルな素材となっております。

ナビ素材の全ての端末でのデザインイメージ
グローバルナビ

背景の色がパタパタとカラフルに変化するナビゲーション

3Dアニメーションとホバーエフェクトを使用したナビゲーション素材です。マウスHover時に項目の背景がパタパタと変化します。色んなカラーを組み合わせて、オシャレなデザインのナビゲーションを作ることができます。

素材反映のご依頼

MATEREATE CONTENTS

ダウンロードして実装したけど、うまく反映しない…

素材を自身のサイトにも実装したいけどWebコーダーが不在のため、実装して欲しい…

そんな方はぜひお気軽にお申し付けください。


無料お見積り後、コードを整理した上で実装・反映いたします。