在线可视化生成Design Token和CSS变量系统 - 多格式导出
Design Token是设计系统的原子级构建块，用键值对表示设计决策（颜色、字体、间距等）。它们是设计与开发之间的桥梁，确保UI一致性。Token可转换为CSS变量、SCSS变量、JSON配置等多种格式，支持跨平台使用（Web/iOS/Android）。
CSS变量是Web平台的原生特性，只能在CSS中使用。Design Token是更高层级的概念，是平台无关的设计决策表示。一个Token可以导出为CSS变量、SCSS变量、Android XML资源、iOS Swift常量等多种格式。Token还支持语义化命名（如--color-primary而非--blue-500）和主题切换。
推荐三级命名：类别.属性.变体，如color.primary.500、spacing.md.4、font.size.lg。语义化命名优于具体值命名：用--color-danger而非--red-500，这样换主题时只需改值不需改名。全局Token（原始值）→别名Token（语义化）→组件Token（特定用途），形成三层架构。
Design Token是设计系统的原子级构建块，用键值对表示设计决策，是设计与开发的桥梁。
CSS变量是Web原生特性，Token是平台无关概念，可导出为多种格式，支持语义化命名和主题切换。
推荐三级命名：类别.属性.变体。语义化优于具体值。全局Token→别名Token→组件Token三层架构。