跳转到内容

返回工具库

自然收录

设计工具 · 免费额度 + 席位订阅

Figma

协作设计工具，适合做界面原型、设计系统、截图素材、社媒图和产品交互评审

这是什么

Figma 是在线协作设计工具，用来做界面设计、交互原型和设计系统；开发者可以在 Dev Mode 里查看尺寸、样式并导出资源。同一账号下还有 FigJam 白板和 Figma Slides。

对独立开发者来说，即使不是设计师，也常用它画关键页面的线框图、套用社区里的 UI Kit、做应用商店截图和社交媒体配图。

适合

写代码前想先把关键页面画清楚的人
需要和设计师协作、交接标注的开发者
需要做产品截图、宣传图的人

不太适合

只想画简单流程图的人，白板类工具更轻
完全不想碰设计、直接用现成模板写代码的人

典型用法

画线框图

先画注册、核心功能、付费三个关键页面，确认流程再写代码。

套用 UI Kit

从 Community 找到和技术栈对应的组件库，在上面拼页面。

做宣传素材

统一尺寸模板制作应用商店截图、社交媒体封面和发布图。

价格与免费额度

Starter 免费：不限草稿，每天 150 个 AI 额度（每月最多 500）。
Professional 按席位计费：Full 席位每月 $16，Dev 席位每月 $12，Collab 席位每月 $3。
Organization（年付）Full 席位每月 $55，Enterprise（年付）Full 席位每月 $90。

2026-10-25 阅读官方价格页整理；价格和额度会调整，下单前以官网实时页面为准。

地区与国内使用

国内访问速度因网络而异，大文件加载需要实测。

上手步骤

注册后在 Community 搜索一个 UI Kit 复制到自己的草稿。
先画最关键的两三个页面，用自动布局保证尺寸可调整。
用原型连线检查页面跳转是否顺。
写代码时在 Dev Mode 或检查面板里查看样式并导出图标。

容易踩的坑

席位类型决定能用的功能，只看标注的开发者用 Dev 席位更便宜。
社区资源的授权不完全相同，商用前看清楚。
设计稿和真实组件容易脱节，尽量用和代码一致的组件命名。

替代选择

Penpot开源、可自托管的设计工具

Excalidraw只需要手绘风格的草图和流程图

参考资料

Figma 定价

同专题项目样本

公开案例仅供参考，不代表成功保证或效果背书。