MotionLang

入场与退场 · 出现和消失

逐词遮罩揭示Masked word reveal

标题里每个词像从一条看不见的横缝里升起来,一个接一个:先出来的已经站定,后面的还在下面等着。文字本身没有淡入,只是从缝里长上来。

在工具里打开这条

什么时候用它

首屏大标题、章节标题、订单确认这类只有一句话要说的位置用它;正文和列表不要用 —— 逐词出现会把阅读速度拖慢一倍。

参数

unit = word (en) / char (zh, ja) · shell overflow hidden · inner transform: translateY(112%) → 0 · 640ms cubic-bezier(.22,1,.36,1) · stagger 85ms

配方

  1. stagger 85ms
  2. 逐词遮罩揭示 → transform translateY(112%) → 0 @ 640ms cubic-bezier(.22,1,.36,1)

给 AI 的一句话

让这个标题逐词从小往上顶出来:每个词外面套一层 overflow:hidden 的壳,词先 translateY(112%) 藏在下面,再按词错峰 85ms 升到 0,每个词 640ms cubic-bezier(.22,1,.36,1)。文字不要淡入,只做位移。

同类的其他动效