MATEREATE CONTENTS

エフェクトプランボックスのデザイン
プラン表

詳細リストにエフェクトがかかるプラン表デザイン

プランタイトルや詳細リストをオシャレに演出するプラン表デザインの無料Web素材です。各サイトの料金表、プラン等を華やかに魅せることができると思います。ホバーしている詳細リストごとにエフェクトがかかるため、非常に見やすくなり、閲覧者にも伝わりやすいプラン表のデザイン素材となっております。

コンタクトフォームのデザインイメージ
コンタクトフォーム

入力時に枠の色が変化するシンプルなコンタクトフォーム

文字入力時に入力欄の枠の色が変化するシンプルなデザインのコンタクトフォームの無料Web素材です。入力中の枠の色が変化するため、入力欄が分かりやすく表示されます。シンプルなデザインながらもアクセントのあるコンタクトフォーム素材となっております。

ひっくり返るinfoボックスのデザイン
お知らせ欄

ホバーでボックスがひっくり返り内容が見えるお知らせ欄

ホバーエフェクトによりボックスがひっくり返る演出するオシャレなレイアウトの無料Web素材です。表には記事のタイトルとアイキャッチ画像、裏には日付と記事の概要や抜粋を表示するデザインとなっております。たくさんの情報を限られたスペースに一度に表示できるため、サイト閲覧者にも優しいWeb素材となっております。

コンテンツボックスの全てのデザインイメージ
コンテンツボックス

タイトルが下に移動し内容が見えるコンテンツボックス

ホバーエフェクトでコンテンツ内容をオシャレに表示するボックスレイアウトの無料web素材です。表側のデザインが変形しながら下側に移動し、裏側に記載の内容が見えるようになっております。画像使用一切なしのWebパフォーマンスとSEOに効果的なコンテンツボックス素材となっております。

プランボックスの全てのデザインイメージ
プラン表

ボックスがズームし背景色が変化するプラン表デザイン

マウスを置くとボックス全体がズームし、背景色が変化するレイアウトの無料Web素材です。ボックス自体がズームされるため、サイト訪問者にどのコンテンツを見ているかをわかりやすく伝えることができます。画像を使用していないためWebパフォーマンスやSEOにも効果的なレイアウト素材となっております。

レイアウト素材の全てのデザインイメージ
コンテンツボックス

本のように開き中身が見えるコンテンツボックス

画像をホバーすると本のように開き内容が見えるレイアウトボックスのWeb素材です。CSSのみで表現しているので手軽に実装でき、さらにSEOにも優しい素材となっております。本の表紙部分となる画像には、コンテンツのイメージ画像。内容部分にはコンテンツの概要を入れるなど様々な場面で活用できると思います。

プランボックスの全てのデザインイメージ
プラン表

項目ホバー時に左右からバーが出るプラン表デザイン

全てCSSのみでデザインしたプランボックスの素材でございます。画像を一切使用してないため、WebパフォーマンスにもSEOにも優しいWeb素材となっております。項目のホバー時には、左右からバーが現れ、アクセントの効いた演出を行います。

infoボックス素材の全ての端末でのデザインイメージ
お知らせ欄

ホバーするとサムネイル画像がズームするお知らせ欄

サイトのお知らせやブログ記事の新着情報などで使えるボックスデザイン素材です。サムネイル画像と記事のタイトル、記事の抜粋(または本文)を表示しています。ボックスをマウスホバーすると、サムネイル画像がズームされます。またタブレット端末以下では、デザインが少し変わって表示されます。

素材反映のご依頼

MATEREATE CONTENTS

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

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

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


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