Ruyi Design Assistant - 如意设计助手

About this plugin

Ruyi Design Assistant helps you efficiently use React component libraries and Design Tokens for design in Figma, conveniently obtain resources from open source icon libraries, and easily get production-level component code.

Component library: Design with the same code component library used by developers to build products. Simply drag and drop components and configure component properties to creat standardized visual representations.

Design Tokens: Easily view and use design system themes in Figma, with one-click quick switching of component themes.

Icon Plaza: The assistant connects to massive and popular open source icon libraries. Drag and drop icons to generate vector layer.

Code inspection: The assistant can accurately check every component code, component property value, and Design Token value used in the design file, eliminating the need to consult documentation outside the design tool and reducing translation deviation during the design-to-product process.

Learn more about plugin usage.

------

如意设计助手，助您在 Figma 中高效使用 React 组件库与 Design Tokens 做设计，便捷获取开源图标库资源，轻松获取生产级组件代码。

组件库：使用与开发者构建产品相同的代码组件库做设计，简单拖拽组件和配置组件属性即可获得规范化的视觉表现。

Design Tokens：轻松查看设计系统设计主题、一键切换组件主题生成对应主题的 figma 设计资源。

图标广场：助手连接海量流行的开源图标库素材。一键拖拽，生成矢量设计资源，助力设计提效。

代码检查：助手可以精准检查出设计稿中使用的每一个组件代码、组件属性值以及 Design Token值，无需跳出设计工具去查阅说明文档，减少设计转变为产品过程中的转译偏差。

了解更多插件使用方法