深客
工具
搜索结果
Figma转代码
多框架支持
一键生成
智能解析
Figma2Code 设计稿转代码
上传设计稿截图或粘贴Figma链接,智能生成HTML/CSS/Tailwind/React/Vue代码
0
识别元素
0
代码行数
0
识别精度
0
处理时间(ms)
图片上传
Figma链接
点击或拖拽图片到此处
支持 PNG、JPG、WebP 格式,最大 10MB
选择图片
设计稿预览
支持 Figma 文件链接,如:https://www.figma.com/file/xxxxx
⚠️ 请先配置 Figma Access Token
获取 Token
转换设置
输出框架
HTML/CSS
Tailwind CSS
React JSX
Vue Template
响应式单位
px
rem
vw
百分比
生成响应式布局
包含代码注释
压缩代码
转换为代码
生成的代码
HTML/CSS
代码预览
×
使用说明
上传设计稿截图或粘贴Figma链接
选择输出框架和单位
点击转换为代码
复制代码或下载文件
提示:上传清晰的设计稿截图效果更好。Figma模式需要配置Access Token,在代码中设置 FIGMA_CONFIG.accessToken