Building Section Hotspots
建築案件カードにホバーすると、各階の役割と寸法線が図面のように現れる。
PRACTICAL WEB TIPS
Hover Effects
実際に動くWeb制作素材。プレビューで試して、HTML・CSSコードを確認できます。
使用対象から探す
ボタン・テキスト・画像など、実際に使う場所で分類しています。
300 items条件に一致する公開素材
Soft Polygon Window
写真の角を柔らかい多角形に変形し、フレームの外周から作品番号を現すホバー。
Neighbor-Dim Navigation
メニュー項目をホバーすると隣接項目が静かに薄まり、アクティブな項目だけにラインが伸びる。
Context Preview Rail
メニューの各リンクに触れると、右側の共通レールにその項目固有のプレビュー情報が切り替わる。
Sortable Header Guide
表の列見出しにホバーすると、並び替え操作を示す矢印と列全体のガイドが現れる。表示専用のUIデモ。
Stack Fan Icon
重なった3枚のダイヤ形レイヤーがホバーで扇状に広がり、素材レイヤー切替を示すアイコン。
Step Indicator Button
CTAの下にある3段階のステップ目盛りが順番に点灯し、次の工程を視覚的に伝えるボタン。
Section Numeral Backdrop
見出しの背後に巨大なセクション番号が浮かび上がる、編集的なページ見出しのホバー。
Word Relay Underline
3つの単語の下線が順送りで入れ替わり、文中の重点を段階的に強調するテキストリンク。
Panorama Slice Parallax
1枚の風景を3つの短冊に切り分け、ホバーすると各パネルが奥行きを変えてずれる画像演出。
Folded Photo Index
写真の右下隅が紙のように折れ、作品番号と補足情報が現れるポートフォリオ用画像ホバー。
Availability Profile Card
人物紹介カードのステータスドットが円環に広がり、対応可能な曜日をホバーで表示するプロフィールUI。
Sliding Latch CTA
鍵のスライド解除を模した二段階ボタン。会員入口や予約開始への誘導に使えるホバー。
Layered Report Card
レポートの見出しを保ちながら、2枚のデータシートが少しずつずれて見える調査レポートカード。
Sitemap Branch Links
サイトマップ項目の枝線がホバーで展開し、関連ページの存在を示すナビゲーション。
Shortcut Hint Navigation
メニューの末尾にショートカットキーのヒントがせり出す、管理画面向けナビゲーション。
Choice Tile Hover Path
ラジオ形式の選択カードに、ホバーで内側のガイドラインが走り、クリックすると選択状態が残るフォーム素材。
Chain Link Connect
離れた2つのチェーンリングがホバーで重なり、リンクの接続を表現するSVGアイコン。