概念代码图层

Code Layers

Figma中的一种特殊图层类型，不直接渲染视觉像素，而是承载与相邻图层关联的代码片段、组件属性或样式逻辑，旨在打通设计上下文与代码输出之间的断层。

时间轴 (近 90 天)

10月17日

Code Layers允许AI Agent和人类开发者将特定设计图层转化为可交互的React或CSS代码，并支持双向同步：将活跃代码仓库克隆到Figma中编辑，再将更改同步回核心代码库。

待验证50%

10月15日

Figma 的 Code Layers 功能已进入开放公测阶段。

待验证50%

10月15日

Code Layers 功能此前已在部分用户中测试。

待验证50%

10月15日

Code Layers 允许在图层层级嵌入代码逻辑，使设计文件本身携带更多工程语义。

待验证50%

10月15日

Code Layers 使设计文件本身携带工程语义，例如某个按钮图层的圆角、间距、颜色可以映射为 CSS 变量或组件 props。

待验证50%

10月15日

Code Layers 公测意味着设计交付流程可能发生变化，前端工程师接收的不再是静态标注，而是带有逻辑上下文的图层结构。

待验证50%

Code Layers 功能此前已在部分用户中测试。

Code Layers 允许在图层层级嵌入代码逻辑，使设计文件本身携带更多工程语义。

Code Layers 使设计文件本身携带工程语义，例如某个按钮图层的圆角、间距、颜色可以映射为 CSS 变量或组件 props。

Figma 的 Code Layers 功能已进入开放公测阶段。

Code Layers 公测意味着设计交付流程可能发生变化，前端工程师接收的不再是静态标注，而是带有逻辑上下文的图层结构。