当你要做多主题（浅色/深色、不同品牌色）或需要统一间距尺度时，手动逐个改颜色非常痛苦。Variables的核心是：把“值”变成可管理的变量，让组件引用变量而不是写死数值。
创建一个Color变量集合（如Theme），建立primary/secondary/bg/text等变量。先只做最常用的5~10个，保证命名清晰：建议用语义命名（Primary/Surface/Text）而不是#FF0000这种值命名。
在同一个集合里添加Modes，比如Light与Dark。给同一个变量在不同Mode下配置不同值。之后你只需要切换Mode，所有引用该变量的组件都会同步变化。
选中文本/填充/描边，把颜色来源改成变量。迁移时按优先级来：先背景与主按钮，再处理正文与弱化文本。迁移完成后，你的组件才真正具备可切换主题的能力。
创建Number变量：space-4/8/12/16/24等；radius-4/8/12等。Auto Layout里的Padding与Spacing都可以引用这些变量，让页面从“凭感觉”变成“按尺度”。
1) 命名别太细：一开始不要上来就做几十个变量。2) 语义优先：同样是灰色，可能分别用于Text Secondary与Border。3) 组件优先迁移：先把按钮、输入框、卡片这种高复用组件变量化。
先做少量核心变量 → 让主组件引用变量 → 再补齐页面 → 最后根据实际使用再细化变量。这样不会一开始就陷入“建库”而不产出页面。
