成为更优秀的产品设计师
学习 Figma, 从这里开始
这里有免费的中文用户指南、工具、资源、模版供你学习和使用
OR
教程与技巧
Figma Sites 零代码建站与自定义域名发布全指南：从响应式布局、SEO 配置到 DNS 绑定实战
深度解析 Figma Sites 零代码网页发布全流程。涵盖 Auto Layout 响应式断点、表单交互配置、SEO 标题与元数据设置、自定义域名 DNS（A/CNAME）解析与 SSL 证书自动配置，并附 Framer 与 Webflow 横向对比及上线排障清单。
Nov 10, 2026
Figma 团队席位权限管理与防额外扣费实战：Full、Restricted 角色分配与计费安全审计
深入解析 Figma 团队席位（Seats）计费机制与权限分配。详解 Full Design/Dev、Viewer 与 Viewer-Restricted 的区别，传授通过设置默认只读受限角色、锁定文件编辑邀请、月底批量审计降级避免账单暴增与意外自动扣费的 5 大避坑策略。
Nov 10, 2026
Figma 免费版（Starter）够用吗？3 个文件、3 个页面等限制说明与超限后的 5 种处理办法
Figma 免费版到底限制了什么？按官方 Starter 方案梳理 3 个文件、每文件 3 页、30 天版本历史、无团队库和 Dev Mode 等限制，并给出超限后的整理、升级与教育版处理办法。
Nov 10, 2026
Figma Slides 制作专业演示文稿全实战：从母版规范、Design 模式自由排版到实时互动与高清导出
全面解析 Figma 原生幻灯片演示工具 Figma Slides。详解 Slides 与传统 PPT/Keynote 的横向对比、Design Mode 自由设计与 Presentation Mode 模式切换、实时投票与表情互动配置、团队品牌母版库规范以及矢量无损导出 PDF 避坑技巧。
Nov 10, 2026
Figma 高级原型与条件逻辑实战：用 Variables 变量、Expressions 表达式与 If/Else 构建可运行真机交互
深度解析 Figma 原型高级进阶技术：结合局部变量（Variables）、条件分支（If/Else）与数学表达式（Expressions），手把手带你实现可动态加减的购物车计数器、带表单校验与报错状态机的登录页、以及无画板冗余的主题动态切换真机原型。
Nov 10, 2026
Figma Code Connect 与 Dev Mode 企业级落地指南：打通 React/Vue 组件代码与设计系统属性映射
系统讲解如何通过 Code Connect CLI 将前端真实代码仓库（React/Vue/TypeScript）与 Figma 设计组件库深度绑定，在 Dev Mode 中直接呈现生产级代码、变体属性映射与 CI 自动化发布流。
Nov 10, 2026
精选资源
Figma Crush
Figma 免费资源库，包括 UI Kit、Icon、Mockups 等
Figma Freebies
一些免费的 Figma 资源
Figma Finder
免费的 Figma 资源和 UI Kit
Figma Resources
设计师在 Figma 社区中分享的免费资源
Set Product
高质量的桌面和移动项目的组件和设计系统模版
Material Design Kit
高质量且响应式的 Material Design UI Kit
iOS Design Kit
适用于 iPhone XS 和 iPhone 8 的 iOS 12 的组件
Design System
旨在分享有关设计系统的示例代码、设计文件和关于构建和维护设计系统的故事
Figma Community
Figma 官方社区，包含 Figma设计资源和插件
Figma.Cool
Figma Cool 包含 Figma 工具箱、设计资源精选和插件合集
Figma CN
Figmacn 包含 Figma 最新资讯和文章
Figma 汉化客户端
提供 macOS Intel & M1、Windows 中文客户端、Chrome 浏览器汉化
优质文章推荐
常见问题解答 (FAQ)
Q Figma 免费版够用吗？有哪些限制？ −
Figma 个人基础版永久免费，包含无限云端草稿、3 个协同项目文件与完整的核心设计与原型功能，对个人设计师和初学者完全足够。
Q 如何快速汉化 Figma 客户端或网页？ +
Q Auto Layout 自动布局的核心优势是什么？ +
Q 什么是 Dev Mode 开发模式？前端工程师如何使用？ +
相关
文章和最佳实践
© FigmaChina. All rights reserved.