{
  "$description": "Jessy V2.2品牌基色与颜色语义；新配色与材质参数为设计候选。",
  "meta": {
    "version": "2.2-color-1",
    "status": "design-candidate",
    "source": "Jessy_Visual_Identity_System_V2.2",
    "date": "2026-10-14"
  },
  "color": {
    "ink": {
      "$type": "color",
      "$value": "#2C3148"
    },
    "blue": {
      "$type": "color",
      "$value": "#5F73C8"
    },
    "lavender": {
      "$type": "color",
      "$value": "#B9B7E8"
    },
    "lilac": {
      "$type": "color",
      "$value": "#D8D8F0"
    },
    "moon": {
      "$type": "color",
      "$value": "#F7F7FB"
    },
    "silver": {
      "$type": "color",
      "$value": "#E9EAF2"
    },
    "night": {
      "$type": "color",
      "$value": "#171B32"
    },
    "nightText": {
      "$type": "color",
      "$value": "#F2F1FA"
    },
    "linkBlue": {
      "$type": "color",
      "$value": "#42549B",
      "$description": "新增浅底普通链接候选，原品牌blue保持不变。"
    }
  },
  "font": {
    "body": {
      "$type": "fontFamily",
      "$value": [
        "Noto Sans SC",
        "Noto Sans CJK SC",
        "Source Han Sans SC",
        "PingFang SC",
        "Microsoft YaHei",
        "sans-serif"
      ]
    },
    "display": {
      "$type": "fontFamily",
      "$value": [
        "Georgia",
        "Times New Roman",
        "serif"
      ],
      "$description": "英文展示候选；不代表品牌正式字体定稿。"
    }
  },
  "type": {
    "h1": {
      "$type": "dimension",
      "$value": {
        "value": 40,
        "unit": "px"
      }
    },
    "h2": {
      "$type": "dimension",
      "$value": {
        "value": 28,
        "unit": "px"
      }
    },
    "body": {
      "$type": "dimension",
      "$value": {
        "value": 17,
        "unit": "px"
      }
    },
    "mobileBody": {
      "$type": "dimension",
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "meta": {
      "$type": "dimension",
      "$value": {
        "value": 13,
        "unit": "px"
      }
    },
    "bodyLine": {
      "$type": "number",
      "$value": 1.75
    }
  },
  "space": {
    "4": {
      "$type": "dimension",
      "$value": {
        "value": 4,
        "unit": "px"
      }
    },
    "8": {
      "$type": "dimension",
      "$value": {
        "value": 8,
        "unit": "px"
      }
    },
    "12": {
      "$type": "dimension",
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "16": {
      "$type": "dimension",
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "24": {
      "$type": "dimension",
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "32": {
      "$type": "dimension",
      "$value": {
        "value": 32,
        "unit": "px"
      }
    },
    "48": {
      "$type": "dimension",
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "64": {
      "$type": "dimension",
      "$value": {
        "value": 64,
        "unit": "px"
      }
    }
  },
  "radius": {
    "control": {
      "$type": "dimension",
      "$value": {
        "value": 14,
        "unit": "px"
      }
    },
    "card": {
      "$type": "dimension",
      "$value": {
        "value": 22,
        "unit": "px"
      }
    },
    "pill": {
      "$type": "dimension",
      "$value": {
        "value": 999,
        "unit": "px"
      }
    }
  },
  "size": {
    "icon": {
      "$type": "dimension",
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "iconStroke": {
      "$type": "dimension",
      "$value": {
        "value": 1.5,
        "unit": "px"
      }
    },
    "controlMinHeight": {
      "$type": "dimension",
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "contentMax": {
      "$type": "dimension",
      "$value": {
        "value": 1280,
        "unit": "px"
      }
    },
    "readingMax": {
      "$type": "dimension",
      "$value": {
        "value": 720,
        "unit": "px"
      }
    }
  },
  "motion": {
    "duration": {
      "$type": "duration",
      "$value": {
        "value": 220,
        "unit": "ms"
      }
    },
    "lift": {
      "$type": "dimension",
      "$value": {
        "value": 2,
        "unit": "px"
      }
    }
  },
  "theme": {
    "light": {
      "text": "{color.ink}",
      "background": "{color.moon}",
      "surface": "{color.moon}",
      "soft": "{color.lilac}",
      "border": "{color.silver}",
      "primary": "{color.ink}",
      "onPrimary": "{color.moon}",
      "primaryHover": "{color.night}",
      "focus": "{color.blue}",
      "disabled": "{color.silver}",
      "link": "{color.linkBlue}",
      "controlBorder": "{color.ink}"
    },
    "dark": {
      "text": "{color.nightText}",
      "background": "{color.night}",
      "surface": "{color.ink}",
      "soft": "{color.ink}",
      "border": "{color.blue}",
      "primary": "{color.nightText}",
      "onPrimary": "{color.night}",
      "primaryHover": "{color.lilac}",
      "focus": "{color.lavender}",
      "disabled": "{color.ink}",
      "link": "{color.lavender}",
      "controlBorder": "{color.lavender}"
    }
  },
  "contrast": {
    "method": "WCAG sRGB相对亮度公式，静态色值计算；不等同于页面综合验收。",
    "ratios": {
      "ink/moon": 11.98,
      "blue/moon": 4.12,
      "nightText/night": 15.12,
      "linkBlue/moon": 6.610003732517359
    },
    "rule": "普通字4.5:1；大字/必要图形分别按适用规则3:1。blue/ink2.91，不能作必要边界；半透明须检查合成背景。"
  },
  "semantic": {
    "light": {
      "text": {
        "primary": {
          "$type": "color",
          "$value": "{color.ink}"
        },
        "secondary": {
          "$type": "color",
          "$value": "{color.ink}"
        },
        "inverse": {
          "$type": "color",
          "$value": "{color.moon}"
        }
      },
      "link": {
        "default": {
          "$type": "color",
          "$value": "{color.linkBlue}"
        },
        "hover": {
          "$type": "color",
          "$value": "{color.ink}"
        },
        "visited": {
          "$type": "color",
          "$value": "{color.linkBlue}"
        },
        "underline": {
          "$type": "string",
          "$value": "always"
        }
      },
      "surface": {
        "canvas": {
          "$type": "color",
          "$value": "{color.moon}"
        },
        "base": {
          "$type": "color",
          "$value": "{color.moon}"
        },
        "tint": {
          "$type": "color",
          "$value": "{color.lilac}"
        },
        "selected": {
          "$type": "color",
          "$value": "{color.lilac}"
        },
        "disabled": {
          "$type": "color",
          "$value": "{color.silver}"
        }
      },
      "border": {
        "decorative": {
          "$type": "color",
          "$value": "{color.silver}"
        },
        "control": {
          "$type": "color",
          "$value": "{color.ink}"
        },
        "selected": {
          "$type": "color",
          "$value": "{color.blue}"
        }
      },
      "focus": {
        "ring": {
          "$type": "color",
          "$value": "{color.blue}"
        },
        "inner": {
          "$type": "color",
          "$value": "{color.moon}"
        }
      },
      "action": {
        "primary": {
          "background": {
            "$type": "color",
            "$value": "{color.ink}"
          },
          "text": {
            "$type": "color",
            "$value": "{color.moon}"
          },
          "hover": {
            "$type": "color",
            "$value": "{color.night}"
          }
        },
        "secondary": {
          "background": {
            "$type": "color",
            "$value": "{color.moon}"
          },
          "text": {
            "$type": "color",
            "$value": "{color.ink}"
          },
          "border": {
            "$type": "color",
            "$value": "{color.ink}"
          }
        }
      }
    },
    "dark": {
      "text": {
        "primary": {
          "$type": "color",
          "$value": "{color.nightText}"
        },
        "secondary": {
          "$type": "color",
          "$value": "{color.nightText}"
        },
        "inverse": {
          "$type": "color",
          "$value": "{color.night}"
        }
      },
      "link": {
        "default": {
          "$type": "color",
          "$value": "{color.lavender}"
        },
        "hover": {
          "$type": "color",
          "$value": "{color.lilac}"
        },
        "visited": {
          "$type": "color",
          "$value": "{color.lavender}"
        },
        "underline": {
          "$type": "string",
          "$value": "always"
        }
      },
      "surface": {
        "canvas": {
          "$type": "color",
          "$value": "{color.night}"
        },
        "base": {
          "$type": "color",
          "$value": "{color.ink}"
        },
        "tint": {
          "$type": "color",
          "$value": "{color.ink}"
        },
        "selected": {
          "$type": "color",
          "$value": "{color.ink}"
        },
        "disabled": {
          "$type": "color",
          "$value": "{color.ink}"
        }
      },
      "border": {
        "decorative": {
          "$type": "color",
          "$value": "{color.blue}"
        },
        "control": {
          "$type": "color",
          "$value": "{color.lavender}"
        },
        "selected": {
          "$type": "color",
          "$value": "{color.lavender}"
        }
      },
      "focus": {
        "ring": {
          "$type": "color",
          "$value": "{color.lavender}"
        },
        "inner": {
          "$type": "color",
          "$value": "{color.night}"
        }
      },
      "action": {
        "primary": {
          "background": {
            "$type": "color",
            "$value": "{color.nightText}"
          },
          "text": {
            "$type": "color",
            "$value": "{color.night}"
          },
          "hover": {
            "$type": "color",
            "$value": "{color.lilac}"
          }
        },
        "secondary": {
          "background": {
            "$type": "color",
            "$value": "{color.ink}"
          },
          "text": {
            "$type": "color",
            "$value": "{color.nightText}"
          },
          "border": {
            "$type": "color",
            "$value": "{color.lavender}"
          }
        }
      }
    }
  },
  "functional": {
    "light": {
      "success": {
        "text": {
          "$type": "color",
          "$value": "#246454"
        },
        "icon": {
          "$type": "color",
          "$value": "#246454"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.moon}"
        },
        "border": {
          "$type": "color",
          "$value": "#246454"
        }
      },
      "warning": {
        "text": {
          "$type": "color",
          "$value": "#765700"
        },
        "icon": {
          "$type": "color",
          "$value": "#765700"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.moon}"
        },
        "border": {
          "$type": "color",
          "$value": "#765700"
        }
      },
      "danger": {
        "text": {
          "$type": "color",
          "$value": "#9F3B57"
        },
        "icon": {
          "$type": "color",
          "$value": "#9F3B57"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.moon}"
        },
        "border": {
          "$type": "color",
          "$value": "#9F3B57"
        }
      },
      "info": {
        "text": {
          "$type": "color",
          "$value": "#42549B"
        },
        "icon": {
          "$type": "color",
          "$value": "#42549B"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.moon}"
        },
        "border": {
          "$type": "color",
          "$value": "#42549B"
        }
      }
    },
    "dark": {
      "success": {
        "text": {
          "$type": "color",
          "$value": "#8FC8B5"
        },
        "icon": {
          "$type": "color",
          "$value": "#8FC8B5"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.night}"
        },
        "border": {
          "$type": "color",
          "$value": "#8FC8B5"
        }
      },
      "warning": {
        "text": {
          "$type": "color",
          "$value": "#E7CD88"
        },
        "icon": {
          "$type": "color",
          "$value": "#E7CD88"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.night}"
        },
        "border": {
          "$type": "color",
          "$value": "#E7CD88"
        }
      },
      "danger": {
        "text": {
          "$type": "color",
          "$value": "#EDA8BC"
        },
        "icon": {
          "$type": "color",
          "$value": "#EDA8BC"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.night}"
        },
        "border": {
          "$type": "color",
          "$value": "#EDA8BC"
        }
      },
      "info": {
        "text": {
          "$type": "color",
          "$value": "#B9B7E8"
        },
        "icon": {
          "$type": "color",
          "$value": "#B9B7E8"
        },
        "surface": {
          "$type": "color",
          "$value": "{color.night}"
        },
        "border": {
          "$type": "color",
          "$value": "#B9B7E8"
        }
      }
    }
  },
  "glass": {
    "status": "design-candidate",
    "light": {
      "base": {
        "$type": "color",
        "$value": "{color.moon}"
      },
      "opacity": {
        "$type": "number",
        "$value": 0.72
      }
    },
    "dark": {
      "base": {
        "$type": "color",
        "$value": "{color.night}"
      },
      "opacity": {
        "$type": "number",
        "$value": 0.8
      }
    },
    "blur": {
      "$type": "dimension",
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "readingOpacity": {
      "$type": "number",
      "$value": 0.96
    },
    "rule": "起测值，按最不利实际合成背景验证；正文100%不透明，重要内容用实色；玻璃关闭时用semantic.surface.base。"
  },
  "gradient": {
    "status": "design-candidate",
    "light": {
      "$type": "string",
      "$value": "linear-gradient(180deg, #D8D8F0 0%, #F7F7FB 100%)"
    },
    "dark": {
      "$type": "string",
      "$value": "linear-gradient(180deg, #2C3148 0%, #171B32 100%)"
    },
    "rule": "背景氛围层使用，文字、字标与主按钮维持实色；真实叠色仍须验证。"
  },
  "usage": {
    "status": "design-candidate",
    "ratioScope": "同一视口内界面实色区域，不含完整插画和摄影",
    "lightPercent": {
      "moon": 60,
      "lilacOrSilver": 25,
      "ink": 8,
      "blue": 5,
      "lavender": 2
    },
    "darkPercent": {
      "night": 65,
      "ink": 20,
      "nightText": 10,
      "blue": 3,
      "lavender": 2
    },
    "scenePercentOfFirstViewport": {
      "Home": 55,
      "Library": 15,
      "Studio": 8
    }
  }
}