Tandem Word Highlight
見出しの3語が異なる方向から色面に押し出され、ホバー時に一斉に強調される。
PRACTICAL WEB TIPS
Hover Effects
実際に動くWeb制作素材。プレビューで試して、HTML・CSSコードを確認できます。
使用対象から探す
ボタン・テキスト・画像など、実際に使う場所で分類しています。
適用中：動き: stagger
12 items条件に一致する公開素材
Parcel Journey Card
配送状況を示す3つの工程アイコンがホバー時に順番に点灯する。
Column Index Navigation
縦ナビのホバーで小さな番号レールが伸び、メニューが連続した流れで移動する。
Syllable Stair Link
3つの語句が階段状にずれながら浮上。短い見出しリンクに向くタイポグラフィ。
Italic Word Tension
見出しの一語だけが斜体に傾きながら横へ伸び、文章のアクセントを付けるタイポグラフィ。
Palette Unfold Portfolio Card
作品紹介カードの下から配色チップとHEXコードが段階的に現れる、デザイン実績向けUI。
Caption Baseline Ladder
短い見出し下の3本の細線が順番に伸び、編集記事やコンテンツリンクの入口を印象づけます。
Color-Band Photo Scan
モノクロ写真が5つの縦帯に分かれて順番にカラーへ戻る、作品一覧向けのホバー演出。
Signal Bars Response
通信状態などの4本のバーがホバーで順番に立ち上がる、ダッシュボード向けの小型アイコン。
Stacked Destination Menu
ナビ項目の裏に重なった行き先ラベルがホバー時に段差を付けて現れる。
Vertical Shutter Photograph
縦型の細いシャッターが順に開き、背面の別ビジュアルを見せる画像ホバー。
Milestone Stat Ladder
指標カードの3つの数字が順番に持ち上がり、企業実績のまとまりを見せる。