Notched Document CTA
角の切り欠きに書類アイコンが収まり、ホバーで資料の受け取り動作を示すダウンロードボタン。
PRACTICAL WEB TIPS
Hover Effects
実際に動くWeb制作素材。プレビューで試して、HTML・CSSコードを確認できます。
使用対象から探す
ボタン・テキスト・画像など、実際に使う場所で分類しています。
適用中：技術: css
300 items条件に一致する公開素材
Duplex Exposure Portrait
同じ構図の2色の景色を乗算レイヤーで重ね、ホバー時に二重露光のように変化する写真表現。
Offset Capsule Slider
二重のカプセル輪郭が逆方向にずれ、中央の申込ボタンを軽やかに際立たせる演出。
Progress Route Navigation
メニュー項目の下を細い経路線が伸び、ホバーした行き先へ到達するナビゲーション。
Stacked Testimonial Sheets
お客様の声カードの背後にある紙が左右へずれ、複数のレビューがあることを示す演出。
Foldout Benefits Ticket
サービスカードの折り返し部分が開いて3つの提供内容を見せる、特徴紹介向けホバー。
Italic Word Tension
見出しの一語だけが斜体に傾きながら横へ伸び、文章のアクセントを付けるタイポグラフィ。
Technical Grid Registration
作品写真の上に建築図面のような十字線・寸法メモが順に現れる、建築実績向け画像ホバー。
Margin Glyph Pop
段落末尾に隠れた装飾記号が飛び出し、記事リンクの余白を動きのアクセントに変える。
Comparison Column Spotlight
比較表の各列へカーソルを乗せると、そのプラン列だけが淡く強調される料金表向けホバー。
Tabular Chapter Nav
章番号と見出しが上下のラインで切り替わる、編集記事のセクション移動ナビゲーション。
Bookmark Ribbon Emblem
ブックマークのリボンが折り返されたように変化し、保存操作への導線を目立たせるホバー。
Notched Price Capsule
価格とアクションを分けた切り欠き型ボタン。ホバーで価格帯が浮き上がり、予約などへ誘導。
Editorial Punctuation Swing
記事見出しの句読点・記号だけがホバーで動き、文字の可読性を崩さずアクセントを付ける。
Windowed Highlight Phrase
見出しの一部分にだけ縦方向のカラーパネルが入り、文字を覆わず下から色が現れる。
Crop-Shift Portfolio Frame
画像の枠は固定したまま、ホバー時だけ写真の見せる範囲を横方向へ移動する作品カード。
Perimeter Trace CTA
四辺を走る細いラインがボタンの輪郭を順番に描く、落ち着いた資料請求CTA。
Orbiting Benefit Notes
中心のサービス名の周囲に、3つの特徴ラベルがホバーで展開する紹介カード。