brand-colors.js 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. /**
  2. * 品牌色板 — JS 侧单一事实源
  3. *
  4. * 说明:
  5. * - SCSS 变量编译期才解析,JS 块内无法引用 $var,因此在此处维护一份等值副本。
  6. * - 替换原则:仅替换 <script> 块内的纯 hex 字符串字面量(颜色字面量,如 '#F97316')。
  7. * - 不替换 canvas 绘图参数、动态拼接色、数据中携带的 hex(保持原始)。
  8. *
  9. * 对应 uni.scss §12-§16 令牌:
  10. * $brand-primary #F97316 → BrandColors.primary
  11. * $brand-primary-light #FB923C → BrandColors.primaryLight
  12. * $uni-primary-pale #FFF7ED → BrandColors.primaryPale
  13. * $dim-body #FF8C42 → BrandColors.body
  14. * $dim-mind #FF6B9D → BrandColors.mind
  15. * $dim-wisdom #6366F1 → BrandColors.wisdom
  16. * $dim-action #10B981 → BrandColors.action
  17. * $dim-wealth #F59E0B → BrandColors.wealth
  18. * $status-success #10B981 → BrandColors.success
  19. * $status-danger #EF4444 → BrandColors.danger
  20. * $status-warning #FBBF24 → BrandColors.warning
  21. * $facade-text-strong #333 → BrandColors.textStrong
  22. * $facade-text-body #666 → BrandColors.textBody
  23. * $facade-text-muted #999 → BrandColors.textMuted
  24. * $facade-fill-ghost #FAFAFA → BrandColors.fillGhost
  25. * $facade-fill-gray-50 #F9FAFB → BrandColors.fillGray50
  26. * $app-surface #FFFFFF → BrandColors.white
  27. * $status-danger-strong-2 #C62828 → BrandColors.dangerDeep
  28. */
  29. export const BrandColors = {
  30. // 品牌橙族
  31. primary: '#F97316',
  32. primaryLight: '#FB923C',
  33. primaryPale: '#FFF7ED',
  34. primaryDark: '#EA580C',
  35. // 五维身份色
  36. body: '#FF8C42',
  37. mind: '#FF6B9D',
  38. wisdom: '#6366F1',
  39. action: '#10B981',
  40. wealth: '#F59E0B',
  41. // 状态色
  42. success: '#10B981',
  43. successLight3: '#34D399', // emerald-400 成功亮档·三档
  44. warning: '#FBBF24',
  45. danger: '#EF4444',
  46. info: '#0EA5E9', // sky-500 信息
  47. infoLight: '#38BDF8', // sky-400 信息亮档
  48. wisdomLight: '#818CF8', // indigo-400 智慧亮档
  49. // 中性灰阶
  50. white: '#FFFFFF',
  51. textStrong: '#333333',
  52. textBody: '#666666',
  53. textMuted: '#999999',
  54. fillGhost: '#FAFAFA',
  55. fillGray50: '#F9FAFB',
  56. // 状态深阶
  57. dangerDeep: '#C62828',
  58. // 通用语义别名(方便使用)
  59. brand: '#F97316',
  60. dimMind: '#FF6B9D',
  61. dimWisdom: '#6366F1',
  62. dimAction: '#10B981',
  63. dimBody: '#FF8C42',
  64. dimWealth: '#F59E0B',
  65. }
  66. // 向后兼容导出(避免 import 路径散乱)
  67. export default BrandColors