推荐一款免费的设计稿转代码软件！

更新时间：2023-07-06 20:52:34

谁还不知道这款免费的设计稿转代码软件 —— 即时设计。即时设计作为国内首个协作式 UI 设计工具，深受大家的喜爱。为了满足大家对于设计稿转代码的需求，它最新推出了 「CODE.FUN」插件。只需上传设计稿，即可智能生成源代码，所有代码支持一键下载。而且它还支持 Sketch、Figma、Photoshop、即时设计等多种不同格式的设计稿智能转换为代码。

点击下图即可体验「CODE.FUN」插件👇

1、即时设计怎么安装「CODE.FUN」插件

首先在搜索引擎界面输入「即时设计」，进入即时设计的官网主页。

在首页上方菜单栏点击「设计社区」——「插件广场」，即时设计提供了很多免费又实用的插件资源，一键即可在线安装使用！

点击下图进入即时设计的插件广场，免费获取各种插件资源👇

然后在插件广场搜索 “code”，找到「CODE.FUN」插件，点击「安装 」，就能在线安装到即时设计的「工作台」区域。

2、怎么使用「CODE.FUN」插件

在即时设计的主页点击「前往工作台」——「工作台」。

然后创建一个新的文件，选择一个合适的画布大小，选择需要生成代码的设计稿画板。在左侧工具栏找到我们安装成功的插件。

第一次使用该插件的时候要先创建项目，然后选择要上传的项目，选择设计稿类型，最后点击上传。

大概等待 30s，即时设计就会自动生成设计稿的代码。上传成功后点击「查看项目」。选择上传的设计稿，打开后点击「下载代码」，然后等待导出即可，它支持 Vue，React，微信小程序，Uni-app，Taro 等不同平台框架代码输出。点击注册即时设计！

3、设计稿转代码为什么选择即时设计

首先，即时设计是一个完全免费的在线 UI 设计工具，而且安装插件在线就能完成，根本不需要复杂的下载程序！「CODE.FUN」插件作为一款设计稿智能生成前端源代码的 AI 工具，它不仅做到像素级还原设计稿，精准匹配每一个画面，而且还拥有智能化布局方案，List、Grid 等组件智能化识别等优势。

另外，即时设计的「资源广场」内含上千种设计资源可以即拿即用，大家完全可以去套用这些免费的设计模板，然后再导入「CODE.FUN」插件去转换代码，这对于新手小白来说是个非常不错的体验！

总而言之，即时设计的「CODE.FUN」插件可以轻松帮助你实现设计稿转代码的需求，只需要点击注册即时设计，然后在线安装插件就能快速转换代码，操作流程非常简单！即时设计还免费提供上万种实用的设计模板，一键复用，满足你的所有需求！