ディテールと演出 · 仕上げの小技
テキストモーフ文字形变
- 繊細
- 驚き
- 短い
ある語が別の語に入れ替わるとき、古い語は上へ抜けながら消え、新しい語が下から入ります。語が姿を変えたように見えます。
使いどころ
見出しの中で入れ替わる語や、状態ラベルの切り替えに使います。本文の入れ替えには使わないでください。読めなくなります。
パラメータ
transform: translateY 100%→0 alternating · per word 260ms · cubic-bezier(0.22, 1, 0.36, 1) · alternating offset 60ms
レシピ
各単語 260msテキストモーフ → translateY 100% → 0 @ 260ms cubic-bezier(0.22, 1, 0.36, 1)往復のずらし 60ms
AI に渡す一文
テキストモーフを作ってください。古い語は上へ抜けながら消え、新しい語は下から入ります。1 語 260ms、cubic-bezier(0.22, 1, 0.36, 1)、ずれは 60ms です。