工业狂飙界面

它解决什么问题

当你为数据仪表盘、作品集或编辑站点做设计时，很容易陷入「圆角、柔光阴影、渐变」的常规模式。这类界面看起来温和，却缺乏机械精度和专业张力。要做出像「解密蓝图」一样的效果，设计师往往要花大量时间调整网格、字体、色彩和纹理，最后还不一定够统一。

技能如何工作

该技能把视觉拆成两条互斥的原型路线，每个项目只能选一种并坚持下去：

• Swiss Industrial Print：偏向浅色，像 1960 年代的机械蓝图。它依赖极高的字重对比、可见的分隔线、大号溢出版面的数字，以及唯一的红色强调。
• Tactical Telemetry & CRT Terminal：只走深色，像军用终端或 HUD。它用高密度表格、等宽字体、ASCII 框线和模拟 CRT 扫描线来制造旧硬件质感。

排版方面，技能把字体分成三层：宏观标题用超黑体，固定用 clamp() 拉开尺度；数据与元信息用小号等宽字体；衬线字体只用于点缀，并且会做半色调或 1-bit 抖动处理。色彩系统禁止渐变和软阴影，只保留一种底色、一种前景色和一个红色强调，深色模式可选一个终端绿但必须限制在单个元素上。

布局采用严格 CSS Grid，元素固定在网格轨道上，用 1px 或 2px 实线划分区域，禁止任何 border-radius。组件层用 ASCII 符号、工业标记和条码纹理替代常规 UI 元素。最后通过 SVG 滤镜和 mix-blend-mode 叠加半色调、扫描线与噪点，让界面看起来有物理颗粒感。

适用边界与注意点

这套风格不适合需要柔和品牌感、大量留白或亲和交互的产品。它强调的是高密度信息、机械感和复古终端气质。执行时要特别注意：不要在同一界面混用浅色与深色基底，不要随意引入新颜色，也不要把装饰性 ASCII 元素堆得过多。