故障（glitch）效果原理是什么？

模拟信号错位：把文字的红、青两个通道向左右偏移，形成 RGB 分离的“故障”观感。本工具用两层偏移的 text-shadow 实现静态版。

怎么做成动态抖动？

在静态基础上加 @keyframes 周期性改变偏移量与裁剪区域即可产生抖动。本工具输出静态版，动态可自行叠加动画。

深色背景 + 无衬线粗体字最出效果，赛博朋克/科技风页面常用。

不会，纯前端、不追踪。

RGB 分离故障风（红/青偏移），调偏移量与颜色，实时预览并复制 text-shadow。纯前端。

GLITCH 故障

文字

偏移3px

色 1 / 2

字号48px

CSS 代码

color: #fff;
text-shadow: 3px 0 #FF003C, -3px 0 #00E5FF;

说明：这是静态 RGB 分离故障风（红/青偏移）。想做动态抖动可再叠加 @keyframes 动画驱动 text-shadow 偏移。

输入文字、调偏移量与两个通道颜色、选字号，复制 CSS。深色背景 + 粗体字最出效果。

同类还有霓虹灯文字效果、box-shadow 生成器、CSS 渐变生成器，均纯前端运行、不上传、不追踪。