Figma推出的Dev Mode MCP通过模型上下文协议（MCP），将设计稿中的结构化信息直接传输给AI编程助手，解决了传统设计转代码的痛点。MCP提取设计变量、组件属性、图层结构等，提升代码准确率。配置MCP服务器并连接AI工具后，AI能基于设计稿生成更精准的代码，显著提高开发效率。

Cursor 的图生代码功能在前端开发中表现亮眼，尤其在ToC和ToB项目中，能快速生成页面结构和组件拆分，大幅提升开发效率。尽管样式细节仍有改进空间，但其功能还原度较高。通过接入 Figma-MCP，Cursor 能更精准解析设计稿，简化开发流程，尤其在处理后台页面时效果显著。总体而言，Cursor 在前端开发中提供了高效的辅助支持。

设计系统中图标库的维护至关重要，Figma用户可通过合理组织、管理和更新图标库提升效率。字体图标和SVG图标各有优劣，需根据项目需求选择。图标尺寸需适应不同设备，自适应图标和响应式图标设计能优化显示效果。Figma中图标组件的设置应保持层级一致，使用扁平化设计，并设置缩放约束。双色图标可通过叠加图层实现，需注意切换时的颜色初始化问题。

在设计产业中，虽然设计师和产品经理的角色各有不同，但两者之间的界限正变得日益模糊。设计师在考虑用户体验和产品功能的同时，产品经理也被要求具备一定的设计思维。今天，我们将探讨在设计思维转型为产品开发的过程中，如何打造一款简化创意流程的灵感设计插件工具。

A behind the scenes look at the technical problems we faced and how we solved them.

After integrating Dev Mode into our design system workflow, I’ve gathered several insights to help teams navigate this powerful tool. Here are my top takeaways.

Figma & AI相结合生成开发代码的一站式解决方案。

如何用figma中的插件完成3D效果饼图,济南UI设计师,站酷网,中国设计师互动平台.

阅读时长 8 分钟，适合听说过Figma并且想尝试某些功能，无从下手的同学

Our nine month journey to horizontally shard Figma’s Postgres stack, and the key to unlocking (nearly) infinite scalability.

When our permissions system broke at the seams, everything came to a halt. This is the story of how we fixed it.

Large prototypes took minutes to load, and users took notice. Here’s how we overhauled our prototype player to improve load time and stability.

配色系统是设计系统的核心元素，创建配色系统的方法有很多种。例如，根据谷歌 Material Design 3 指南，一个设计系统必须具有主色、次要色、三级色和表面色（各种背景色）调色板，这将迫使你使用超过 40 种颜色。这么多的颜色会导致混乱，在设计过程中的会有干扰，大多数颜色甚至不会被使用。

设计系统是公司的核心产品，其用户是设计、开发和创意团队。因此，设计系统必须为所有人理解，为团队使用，为测试提供错误检查，并为公司盈利。我一直在努力实现这些目标，并因此改进了一种提供这些功能的配色系统。

追赶者才会差异化竞争，头部则直接“劫杀”。

随着业务发展、产品迭代和团队规模不断壮大，如何高效管理不断积累的设计稿件、提升协作效率成为团队管理规范化不可缺失的一环。本文将分享笔者制定团队 Figma 文件管理规范的经验，每个团队的实际情况不同，希望能为大家提供一些解决问题的思路。