imgcook 专注以 Sketch、PSD、静态图片等形式的视觉稿作为输入,通过智能化技术一键生成可维护的前端代码,包含视图代码、数据字段绑定、组件代码、部分业务逻辑代码等。

imgcook 的主要功能是视觉稿一键还原和基于还原后的可视化编辑Sketch/Photoshop 设计稿的还原从安装插件开始,在设计稿中通过插件导出视觉稿的 JSON 描述信息粘贴到 imgcook 可视化编辑器,在编辑器中可以进行视图编辑、逻辑编辑等,生成代码后可将代码导出到本地或您的工程文件。主流程如下箭头所示。

阿里imgcook设计稿生成代码

除了视觉稿还原服务,我们还提供了如 imgcook-cli、imgcook VS Code 插件等工程效率工具,也支持用户自定义 DSL、自定义 Plugin 等。另外我们还在全链路探索 AI 赋予 imgcook 的能力,如图片生成代码、文本语义理解等。

对于创建的模块,您还可以按团队、项目维度来管理,如果您想看一些精选案例,可以前往广场查看。

评论交流3

登录后可发布评论哦~
    avatar
    温柔阳
    2026-05-10

    体验了一下imgcook,把设计稿一键转成前端代码,确实省去了很多繁琐的切图时间。它的可视化编辑器很直观,上手方便。虽然遇到复杂业务逻辑可能还需要手动微调,但作为辅助工具,已经能帮我们减轻不少负担了。

    avatar
    是我
    2026-05-10

    imgcook对基础页面的还原确实挺省心的,大大减少了手写静态布局的繁琐,可视化编辑修改起来也很直观。只是遇到特别复杂的交互逻辑时,生成的代码可能还需要自己再稍微打磨优化一下。总体来说,是个能帮前端节省不少精力的好帮手。