详细内容

您好,因 Github 登录不稳定,建议您尽快切换至钉钉登录,切换方式请点击查看 ►
去看看
Convert Your Design to Code
王\\\* generated 1364 lines of code 2 days agoph***z generated 291 lines of code 23 hours ago王\\\* generated 411 lines of code 1 days ago王\\\* generated 1497 lines of code 1 days ago王\\\* generated 1282 lines of code 1 days ago王\\\* generated 324 lines of code 1 days ago王\\\* generated 447 lines of code 1 days ago王\\\* generated 1509 lines of code 1 days agoew***l generated 129 lines of code 1 days ago李\\\* generated 609 lines of code 2 days ago王\\\* generated 1364 lines of code 2 days agoph***z generated 291 lines of code 23 hours ago
57,591users have uploaded137,772screens
and generated94,281,002lines of code
Code availability rate reaches79%
Watch Video
Get StartedDownload plugin


Support 4 Types of Design
Use plugin to export design or upload the design file in the imgcook editor
Export from plugin
Download Plugin
Download Plugin
Download Plugin
Upload Design
Upload File
Upload File
Upload File
Intelligent and High Maintainability
DOM nesting is reasonable, relative positioning layout, classname semantics and cyclic automatic recognition
View Case in Gallery


Support 10 types of code generated officially
10 DSLs such as react, rax, Vue and applet are officially provided to generate different types of codes.Users can also customize DSL to generate any code that meets their own needs
How to use DSL?




Integration into R & D process
Provide a variety of ways to seamlessly connect with your R & D link after code generation
-
Custom plugin
When using imgcook to export the generated code, you can use a custom plugin to process the code products, such as automatically uploading pictures to your own picture space, file directory conversion, etc.
-
imgcook cli
Imgcook cli can integrate the code products generated by the imgcook platform into your local project with plugin's ability to seamlessly integrate them into your R & D process.
-
imgcook visual studio
In order to match the powerful engineering capability of vs code, we provide the vscode imgcook editor plug-in, which can paste the data exported from the design tool into the vscode imgcook editor plug-in, generate the code and export it to the corresponding folder directory.
-
Custom components
In order to enable developers to use their own components on the imgcook platform, we provide an open material system to support the configurable, recognizable, intervenable, renderable and code output of the component library.
Case Study
They have integrated imgcook into their projects to help the frontend improve R & D efficiency and help the company reduce labor costs.
-
imgcook in Haomo Tech
Imgcook sketch plugin export, custom DSL, command line, plugin and other capabilities are used to improve the efficiency of front-end code development.
-
imgcook in Youpingjie
The designer uses the capabilities of design material management, design layer marking and code export to effectively cooperate with the frontend and reduce a lot of unnecessary communication with the frontend.
-
imgcook in Alimama
Boom is an integrated platform for Alimama's intelligent single pit production and delivery. It seamlessly integrates the core capabilities of imgcook into its own platform link, and customizes the imgcook visual editor to guide its own business process.
-
imgcook in Youku
Minion is an intelligent material generation platform for Youku. It has created a new material development link by combining imgcook, lowcode and other technologies. Combined with its own business, minion adapts to Youku's R & D ecology, distinguishes between R & D and non R & D perspectives, and generates materials that can be built and iterated.
Who is using
Alibaba frontend team is using imgcook on a large scale.The development efficiency of Tmall's Double Eleven Activity in 2019 has been greatly improved, and the code availability after generation (the number of code lines retained after going online accounts for the total number of online code lines) is 79.34%. The effect continues to improve.
Partner Sites


















