SuperAPI AI 工具集

glitch-text

设计与创作

查看项目

更新于 10-16 01:36

技能介绍

用途:为标题添加 RGB 分离的故障闪烁效果,呈现科技感、前卫的揭示动画。

主要能力:纯 CSS 实现,无外部依赖;在 prefers-reduced-motion 环境下保持稳定,不会持续抖动。

使用方式:复制 glitch-text.css,然后在标题元素上使用 class="glitch",并通过 data-text 属性写入与元素文本一致的文字,例如 <h1 class="glitch" data-text="HELLO">HELLO</h1>。注意 data-text 必须与显示文本匹配。

适用场景:适合需要科技、前卫氛围的标题展示。

限制:资料仅说明其为纯 CSS、无依赖且对 reduced-motion 安全,未提供更多浏览器兼容性、参数配置或自定义选项信息。