SuperAPI AI 工具集

hyperframes-fx-grid-pixelate-wipe

设计与创作

查看项目

更新于 10-16 05:02

技能介绍

用途:这是一个持续型组件转场,把画面切成网格瓦片并错峰淡出,用于场景之间的切换。适合科技、数据卡片的“数字化”揭示,以及 8 位、复古游戏质感;官方建议避免用于情感化、感性基调。

安装:运行 npx hyperframes add grid-pixelate-wipe,会生成 compositions/components/grid-pixelate-wipe.html。

使用方式:复制 components/grid-pixelate-wipe.html 中的 HTML/CSS 片段,插入到场景之间。组件自身运行关键帧,只需对齐 data-* 时间参数,例如 data-start、data-duration、data-track-index,并设置 position: absolute; inset: 0。

参数:瓦片数量与错峰延迟通过组件内部的 CSS 自定义属性调整。

搭配:适合与 transitions-grid、chromatic-radial-split 组合;官方建议避免与 light-leak、grain-overlay 同用,因为数字与模拟质感会冲突。

限制:资料未提供更多平台、性能或兼容性信息。