做完设计只是开始，真正的效率来自“交付可用、标注清晰、规范一致”。这份清单整理了常见的设计交付、标注检查与设计 Token 管理工具，适合在设计与开发之间建立更稳定的协作流程。
工具地址：https://zeplin.io/
需看协议｜主流设计交付平台，支持标注、导出资源、团队协作与开发备注。
需看协议｜在同一文件里直接面向开发查看属性、样式与组件信息，减少来回截图解释。
工具地址：https://penpot.app/
需看协议｜开源设计工具自带 Inspect 能力，适合希望自建或更可控协作环境的团队。
需看协议｜把颜色、字号、间距等抽成 Token，统一管理并能导出到工程侧。
工具地址：https://amzn.github.io/style-dictionary/
免费商用｜设计 Token 的构建与多端输出工具，可生成 iOS/Android/Web 等平台格式。
需看协议｜聚焦 Token 与设计系统资产的集中管理，适合把规范与产物长期沉淀下来。
需看协议｜把设计系统与规范写成可查的文档站，适合跨团队共享与版本管理。
工具地址：https://storybook.js.org/
免费商用｜前端组件工作台，方便把 UI 组件可视化、可测试化，降低设计验收沟通成本。
工具地址：https://www.chromatic.com/
需看协议｜为 Storybook 提供托管与视觉回归测试，组件改动一眼可见。
工具地址：https://jakearchibald.github.io/svgomg/
免费商用｜交付图标与插图前压缩优化 SVG，减少体积并保持渲染一致性。
工具地址：https://squoosh.app/
免费商用｜交付 WebP/AVIF 等格式，兼顾清晰度与加载速度，适合大量图片资源场景。
工具地址：https://webaim.org/resources/contrastchecker/
免费商用｜交付前快速校验文字与背景对比度，避免上线后再返工改色。
