用 HTML-in-canvas 与 Three.js 制作玻璃界面

是什么 这是一条以实时图形为核心的前端视觉实验展示。推文明确提到以 HTML-in-canvas 与 Three.js 制作玻璃效果；画面则把 Prism 的导航、标题、按钮和材质面板放进同一套暗色空间中，主题是浏览器里的色散、透射与折射预览。

核心设计 设计重点不是简单叠加半透明模糊，而是用不规则多边形分割版面，以极细亮边、低饱和渐变、边缘高光和深色底制造“玻璃片”之间的厚度、遮挡与折射感。视频代表帧里面板透视、位置和高光关系持续变化，强化了实时材质的可信度；大号无衬线标题与克制 CTA 则把复杂渲染能力压缩成清晰的产品叙事。

关键洞察 对工程师而言，价值在于把渲染技术直接转化为界面语言：材质参数成为可感知的交互反馈，Studio、Materials、Read paper 又分别承接试用、探索和理解。KHR_materials_dispersion 的露出也让概念与实现线索建立连接。

边界与风险 canvas/3D 场景可能削弱文本可访问性、SEO、键盘操作与低端设备性能；深色低对比文字在不同屏幕上也有可读性风险。落地时应保留语义 DOM、减少实时折射成本，并为 prefers-reduced-motion 与静态降级提供路径。