当团队开始做一套可复用的组件库时，最容易卡在三件事：规范怎么沉淀、设计与代码怎么对齐、变更如何稳定发布。下面整理了一组常用的设计系统/组件库工具与资源入口，覆盖组件示例、文档站、Token 管理与发布检查，便于按需组合出适合你团队的工作流。
工具地址：https://www.figma.com/community
需看协议：社区资源的授权范围差异很大，商用前务必查看作者许可与 Figma 条款。
适合用来快速参考组件命名、变体组织、Auto Layout 结构与交互注释方式。
工具地址：https://storybook.js.org/
免费商用：开源项目（常见为 MIT 许可），可用于商业项目与团队内部组件库。
支持把组件在不同状态下“可视化展示”，并结合 Controls/Docs 做交互说明与 API 文档。
工具地址：https://www.chromatic.com/
需看协议：SaaS 按套餐计费，免费/付费能力差异明显，商用与团队规模请看官方条款。
提供可分享的组件预览链接、Review 流程与视觉回归对比，适合把“改动是否影响 UI”纳入发布门槛。
需看协议：SaaS 服务，集成与权限管理通常在付费计划中，商用前请核对套餐与许可。
常见用法是同步 Figma 组件与样式，把规范、示例、用法说明集中到一个对外可读的文档站。
需看协议：商业产品，输出到不同平台与协作权限受计划影响，商用请以官方授权为准。
适合需要把设计资产、规范与代码资源打包输出并持续维护的团队。
需看协议：插件与同步能力可能涉及付费或第三方存储，企业商用请确认授权与数据合规。
可在 Figma 中管理颜色/字号/间距等 Token，并导出 JSON 供工程侧消费。
工具地址：https://amzn.github.io/style-dictionary/
免费商用：开源许可（常见为 Apache 2.0），可用于商业项目的 Token 构建与发布。
把同一份 Token 转成 iOS/Android/Web 等目标格式，减少“设计改了但代码没跟上”的断层。
需看协议：SaaS 产品，权限、同步与输出格式因计划而异，商用前请核对许可。
更偏向把设计数据结构化管理，支持与工程侧的 Token/组件流程对接。
需看协议：提供云端协作与托管能力，团队使用的授权与资源配额需看官方条款。
适合需要把组件代码、示例、文档与发布流程放在同一处协作的团队。
工具地址：https://www.radix-ui.com/
免费商用：开源组件库（具体许可以仓库为准），可作为搭建产品级组件系统的基础。
如果你更重视可访问性与交互细节，可以用它作为“组件行为层”，再叠加你的视觉体系。
需看协议：规范内容可学习参考，但品牌资产/图标等资源的使用范围需遵守官方规则。
适合用来对齐交互模式、组件行为与可访问性建议，作为规范制定的参考基线。
工具地址：https://carbondesignsystem.com/
免费商用：相关组件与资源多为开源（常见 Apache 2.0），可用于商业项目，仍建议核对各仓库许可。
内容覆盖设计原则、组件用法与代码实现示例，适合学习“规范如何落地到工程侧”。
