用途:为终端风格、黑客美学、CRT 显示器效果与赛博朋克/合成波界面提供设计与实现指导,覆盖 React、SwiftUI 与纯 CSS/WebGL 三类平台。
主要能力:给出复古视觉元素清单(深色背景、等宽字体、制表符边框、霓虹辉光、扫描线、有限配色、高对比度,可选 CRT 曲率、色差与闪烁);提供荧光绿、赛博霓虹、琥珀 CRT 等配色方案;整理制表符字符集与推荐字体;给出终端文案规范(大写标题与标签、小写命令、[SYS]/[ERR] 等消息前缀、终端动词与状态词)。
使用方式:React 侧安装 npm install tuimorphic,引入组件与样式,通过 theme-dark tint-green 等 CSS 类配置主题,并用 CSS 添加霓虹辉光与闪烁动画;SwiftUI 侧在 iOS 17+ 使用 .colorEffect()、.distortionEffect()、.layerEffect() 配合 Metal 着色器实现 CRT 效果,并提供 .crtEffect() 与 .neonGlow() 修饰符示例;Web 侧用 repeating-linear-gradient 做扫描线、多重 text-shadow 做霓虹文字,或用 CRTFilter.js 的 CRTFilterWebGL 实现 WebGL CRT。
适用场景:终端风格应用、黑客主题界面、复古游戏与合成波视觉、需要 CRT 质感的展示页面。
限制与注意事项:资料强调需在 iTerm2、Terminal.app、Windows Terminal、SSH Linux、Alacritty 等目标终端测试,旧终端可能不支持 Unicode 制表符与 256 色,需回退 ASCII 并重置属性;固定宽度布局在终端缩放时易断裂,应使用视口相对单位与截断;输入需处理 UTF-8 多字节字符、粘贴缓冲、方向键与 IME 组合输入;CSS 阴影层数建议控制在 4-5 层,Metal 着色器需保持简单并考虑低端设备与无障碍关闭选项。具体收费、价格与平台支持范围资料未提供。