矢量图标与视觉设计 · 策划 / 美术
Recraft
生成可编辑的SVG图标，把技能与道具视觉做成一套。
免费试用 / 商用须付费生成网页SVGPNGFigmaIllustrator
任务建议
适合用在什么地方
需要可编辑矢量图标时优先试；只做概念氛围探索可比较Midjourney，整套画布构思可比较Lovart。
- 带入什么
- 技能或道具清单、目标显示尺寸、色板与有权使用的风格参考
- 得到什么
- 可编辑SVG图标候选和整理后的路径、颜色、尺寸规范
不适合直接交给它的事
- 免费生成后直接用于商业游戏或假定升级自动补齐旧素材许可
- 一次生成就得到完整交互界面和可上线UI工程
适合视觉素材与矢量草稿，不能把生图当成完整UI设计或工程交付；免费方案生成素材不得直接用于商业游戏。
开始前需要准备
- 先决定仅个人试验还是商业生产；商业生产应在符合条款的付费方案下生成。
- 选择原生Vector模型，准备Figma或Illustrator用于SVG路径与小尺寸检查。
试用任务 · 需要人工验收
制作并检查一组三枚技能图标
试用输入：护盾、冲刺、治疗三项技能说明，同一色板与48像素目标显示尺寸
- 为三项技能设定共同风格、轮廓留白与配色，使用原生矢量模型生成候选。
- 导出SVG，打开路径检查并统一描边、画布与不必要的细碎节点。
- 按48像素显示并测试灰度或低对比状态，标记语义不清的候选再修订。
怎样判断这次尝试有用
- SVG包含可编辑路径，而非仅包了一张位图。
- 三枚图标在目标尺寸可区分，颜色、留白和视觉重量一致。
- 保存生成时方案与素材来源，商业使用不混入免费生成素材。
产物接下来交给谁
按UI资产规范整理SVG与栅格导出，交设计师补充禁用态、选中态和切图；再由工程接入。
官方演示 · 2 项
看产品如何工作
Recraft · 视频演示
Recraft Studio官方工作台演示
官网内嵌工作台演示，用于了解编辑与设计方式；具体矢量模型和商用权益需结合当前文档。
这段演示看什么：工作台演示
视觉生成与编辑 · 设计工作台
点击后加载，播放需手动开始。若受网络或地区限制，请打开官方来源查看。
资料核验：
Recraft · 演示页面
Recraft原生矢量模型与导出
官方图文解释原生Vector模型与可编辑SVG输出；页面示例不等于游戏UI适配实测。
这段演示看什么：矢量流程
原生SVG输出 · 模型选择与设计示例
资料核验：
也可以看看这些选择
比较产物和接入条件，选择更贴近任务的一项。
Nano Banana
工具推荐
Nano Banana
围绕同一张参考图迭代材质与局部设计。
Nano Banana 所属 Gemini 官方图标
