Italic Word Tension
見出しの一語だけが斜体に傾きながら横へ伸び、文章のアクセントを付けるタイポグラフィ。
PRACTICAL WEB TIPS
Hover Effects
実際に動くWeb制作素材。プレビューで試して、HTML・CSSコードを確認できます。
使用対象から探す
ボタン・テキスト・画像など、実際に使う場所で分類しています。
適用中：使用対象: text
43 items条件に一致する公開素材
Margin Glyph Pop
段落末尾に隠れた装飾記号が飛び出し、記事リンクの余白を動きのアクセントに変える。
Editorial Punctuation Swing
記事見出しの句読点・記号だけがホバーで動き、文字の可読性を崩さずアクセントを付ける。
Windowed Highlight Phrase
見出しの一部分にだけ縦方向のカラーパネルが入り、文字を覆わず下から色が現れる。
Headline Shadow Extrusion
見出し文字の後方に段階的な色の影が生まれ、紙を重ねたような立体感を与えます。
Caption Baseline Ladder
短い見出し下の3本の細線が順番に伸び、編集記事やコンテンツリンクの入口を印象づけます。
Vertical Reading Marker
縦組みの短い見出しをホバーすると横組みの補足見出しが現れる、和文エディトリアル向けリンク。
Inline Glossary Rail
専門用語のリンクにホバーすると横に定義ラベルが滑り出す、技術記事向け表現。
Citation Footnote Bloom
記事の注釈番号をホバーすると、小さな書誌情報カードが横に開く引用リンク。
Ruby Note Reveal
見出しの上に小さな補足読み・英語ラベルが現れる。文字の読解を助けるホバー。
Split Offset Headline
同じ見出しの上下半分が左右にずれ、文字を変更せずに奥行きのあるホバーを作る。
Dot Matrix Baseline
リンクの文字下にドットが左右へ順番に現れ、読みやすさを保ちながら選択状態を伝える。
Typographic Side Index
記事リンクにホバーすると、大きな番号が横から滑り込み、見出しの区切り線が伸びる。
Alternating Word Window
横長の文字窓の中で英単語が縦に入れ替わる。見出しの幅を動かさずテキストを演出。
Outline to Ink
線だけの大型英字がホバーで塗りつぶされ、背景のアクセント線も伸びる見出し演出。
Margin Note Reveal
記事の見出し横に隠れた補足ラベルが現れる、エディトリアルデザイン向けリンク。
Editorial Marker Stroke
記事タイトルの単語の下に、マーカーで線を引くようなハイライトが左から現れる。
Word Cascade Hover
3つの単語が少しずつ時間差で持ち上がり、ポートフォリオの見出しにリズムを与える。