MATERIAL

MATEREATEで取り扱う様々な無料Web素材

お気に入りのソースコードは無料ダウンロード可能

皆様のサイト制作にお役立てください

navigation

  • メニュー項目の上下にボーダーが現れるグローバルナビ

    メニュー項目の上下にボーダーが現れるグローバルナビ

    グローバルナビ

    メニュー項目をホバーで、項目の上下部分に左右からラインが......

  • フェードインで出現し項目名が変化するグローバルナビ

    フェードインで出現し項目名が変化するグローバルナビ

    グローバルナビ

    項目をホバーすると文字がフェードインしながら出現し、項目......

  • おしゃれなアニメーションで出現するサイドナビの画像

    おしゃれなアニメーションで出現するサイドナビ

    サイドナビ

    アイコンをクリックするとおしゃれなアニメーションで出現す......

image

  • 浮かびながらゆっくりと揺れるイメージ表示

    浮かびながらゆっくりと揺れるイメージ表示

    画像表示

    画像が浮かびながらゆっくりと横に揺れる画像表示の無料We......

  • フルスクリーンで画像を表示するスライドショー

    フルスクリーンで画像を表示するスライドショー

    スライドショー

    全てCSSのみで作成した常にフルスクリーンで画像が表示さ......

  • 束ねた写真をズラしたようなイメージ表示の画像

    束ねた写真をズラしたようなイメージ表示

    画像表示

    画像に白い縁を加え写真のように表示する画像表示のWeb素......

icon

  • 真ん中のバーが消え上下のバーが×になるメニューアイコン

    真ん中のバーが消え上下のバーが×になるメニューアイコン

    メニューアイコン

    メニューアイコンをクリックでオシャレにデザインが変化する......

  • くるりと前に回転するSNSシェアボタン

    くるりと前に回転するSNSシェアボタン

    SNSアイコン

    アイコンにマウスを置くと、ホバーエフェクトによりアイコン......

  • 3つの矢印が順にフェードイン&アウトするスクロールアイコンの画像

    3つの矢印が順にフェードイン&アウトするスクロールアイコン

    スクロールアイコン

    CSSのみでデザインされた3つのアローアイコンが縦に並ぶ......

  • 3つのドットがバツマークに変化するメニューアイコンの画像

    3つのドットがバツマークに変化するメニューアイコン

    メニューアイコン

    ドットが3つ並んだシンプルながらも可愛らしいデザインのメ......

parts-design

  • 本のように開き内容を表示するボックスデザイン

    本のように開き内容を表示するボックスデザイン

    コンテンツ表示

    画像をホバーすると本のように開き内容が見えるレイアウトボ......

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

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

    お知らせ欄

    サイトのお知らせやブログ記事の新着情報などで使えるシン......

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

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

    プラン表

    全てCSSのみでデザインしたプラン表のWeb素材です。......

area-design

Coming Soon...

button

  • ホバーすると上下部分にラインが現れるボタン

    ホバーすると上下部分にボーダーが現れるボタン

    エフェクトボタン

    シンプルなホバーエフェクトを使用したボタンのWeb素材で......

  • 文字がフェードイン&アウトしながら色が変化するボタン

    文字がフェードイン&アウトしながら色が変化するボタン

    エフェクトボタン

    ボタンの上にマウスを置くと、フェードイン&アウトをしなが......

  • スイッチ内の背景が変化するシンプルなトグルボタンの画像

    スイッチ内の背景が変化するシンプルなトグルボタン

    インプットボタン

    お問い合わせページで使用頻度の多いチェックボックスボタン......

text

  • ホバーすると文字の文字の間隔が広がるテキスト

    ホバーすると文字と文字の間隔が広がるテキスト

    エフェクトテキスト

    ホバーすると文字と文字の間隔が広がる演出をするテキストの......

  • 3色に変化するテキストアニメーションの画像

    3色に変化するアニメーションテキスト

    アニメーションテキスト

    CSSアニメーションにより文字が3色に変化するテキストア......

  • 縁のあるおしゃれなテキストデザインの画像

    縁のあるおしゃれなテキストデザイン

    テキストデザイン

    文字を縁取ったおしゃれなテキストデザインのWeb素材です......

usability

Coming Soon...

CONTACT