细节与特效 · 耐看的小细节
数字滚动Number ticker
- 变化可感
- 有反馈
- 清晰
数字不是直接跳到新值,而是从旧值快速滚动到新值,让变化的大小看得见。
什么时候用它
统计数字、余额、分数更新时用它;数字每秒变化多次时不要用,会糊成一片。
参数
600ms · ease-out · tabular-nums keeps width stable
配方
数字滚动 → 600ms ease-out数字滚动 → tabular-nums keeps width stable
给 AI 的一句话
让这个统计数字从旧值滚动到新值:600ms、ease-out,用 tabular-nums 保持宽度不跳动。