{
  "id": "web-an-ye-zi",
  "name": "暗夜紫",
  "platform": "web",
  "platformLabel": "WEB 端",
  "slug": "an-ye-zi",
  "tags": [
    "暗黑",
    "科技",
    "赛博"
  ],
  "scene": "开发者工具 / 技术社区深色主题",
  "advice": {
    "family": "紫",
    "depth": "主色很浅，更适合做背景与容器，强调元素建议另配一个更深的颜色来承担。",
    "muted": null,
    "suit": "适合创意、美妆、内容、会员体系等偏感性的场景。",
    "avoid": "高饱和的紫容易显得浮夸，B 端与工具类产品要慎用。",
    "pair": "点缀一点金色，能强化它的高级感。"
  },
  "source": "preset",
  "score": 80,
  "createdAt": "2026-10-12",
  "license": "数据可自由引用，建议注明来源",
  "page": "https://paletteget.com/zh/palette-list/web/an-ye-zi/",
  "colors": [
    {
      "key": "primary",
      "label": "Primary",
      "desc": "主色，对应 CSS 变量 --color-primary",
      "hex": "#a78bfa",
      "rgb": "rgb(167, 139, 250)",
      "hsl": "hsl(255.1, 91.7%, 76.3%)",
      "hslRaw": {
        "h": 255.1,
        "s": 91.7,
        "l": 76.3
      }
    },
    {
      "key": "primaryHover",
      "label": "Primary Hover",
      "desc": "悬停态：--color-primary-hover",
      "hex": "#8b6ef0",
      "rgb": "rgb(139, 110, 240)",
      "hsl": "hsl(253.4, 81.3%, 68.6%)",
      "hslRaw": {
        "h": 253.4,
        "s": 81.3,
        "l": 68.6
      }
    },
    {
      "key": "primaryActive",
      "label": "Primary Active",
      "desc": "按下态：--color-primary-active",
      "hex": "#6d4fd8",
      "rgb": "rgb(109, 79, 216)",
      "hsl": "hsl(253.1, 63.7%, 57.8%)",
      "hslRaw": {
        "h": 253.1,
        "s": 63.7,
        "l": 57.8
      }
    },
    {
      "key": "textMain",
      "label": "Text Main",
      "desc": "主文字：--color-text-main",
      "hex": "#ede9fe",
      "rgb": "rgb(237, 233, 254)",
      "hsl": "hsl(251.4, 91.3%, 95.5%)",
      "hslRaw": {
        "h": 251.4,
        "s": 91.3,
        "l": 95.5
      }
    },
    {
      "key": "textSub",
      "label": "Text Sub",
      "desc": "次级文字：--color-text-sub",
      "hex": "#a29bc4",
      "rgb": "rgb(162, 155, 196)",
      "hsl": "hsl(250.2, 25.8%, 68.8%)",
      "hslRaw": {
        "h": 250.2,
        "s": 25.8,
        "l": 68.8
      }
    },
    {
      "key": "bg",
      "label": "Background",
      "desc": "页面背景：--color-bg",
      "hex": "#0f0d1a",
      "rgb": "rgb(15, 13, 26)",
      "hsl": "hsl(249.2, 33.3%, 7.6%)",
      "hslRaw": {
        "h": 249.2,
        "s": 33.3,
        "l": 7.6
      }
    },
    {
      "key": "surface",
      "label": "Surface",
      "desc": "卡片/面板背景：--color-surface",
      "hex": "#1a1729",
      "rgb": "rgb(26, 23, 41)",
      "hsl": "hsl(250, 28.1%, 12.5%)",
      "hslRaw": {
        "h": 250,
        "s": 28.1,
        "l": 12.5
      }
    },
    {
      "key": "border",
      "label": "Border",
      "desc": "边框分割线：--color-border",
      "hex": "#2e2947",
      "rgb": "rgb(46, 41, 71)",
      "hsl": "hsl(250, 26.8%, 22%)",
      "hslRaw": {
        "h": 250,
        "s": 26.8,
        "l": 22
      }
    },
    {
      "key": "link",
      "label": "Link",
      "desc": "链接色：--color-link",
      "hex": "#6837fb",
      "rgb": "rgb(104, 55, 251)",
      "hsl": "hsl(255, 96.1%, 60%)",
      "hslRaw": {
        "h": 255,
        "s": 96.1,
        "l": 60
      }
    },
    {
      "key": "accent",
      "label": "Accent",
      "desc": "强调色：--color-accent",
      "hex": "#22d3ee",
      "rgb": "rgb(34, 211, 238)",
      "hsl": "hsl(187.9, 85.7%, 53.3%)",
      "hslRaw": {
        "h": 187.9,
        "s": 85.7,
        "l": 53.3
      }
    }
  ],
  "roles": {
    "primary": "#a78bfa",
    "primaryHover": "#8b6ef0",
    "primaryActive": "#6d4fd8",
    "textMain": "#ede9fe",
    "textSub": "#a29bc4",
    "bg": "#0f0d1a",
    "surface": "#1a1729",
    "border": "#2e2947",
    "link": "#6837fb",
    "accent": "#22d3ee"
  },
  "contrast": {
    "textOnBg": {
      "ratio": 16.19,
      "level": "AAA"
    },
    "primaryOnBg": {
      "ratio": 7.06,
      "level": "AAA"
    },
    "textOnSurface": {
      "ratio": 14.76,
      "level": "AAA"
    }
  },
  "usage": {
    "cssVariables": ":root {\n  --color-primary: #a78bfa;\n  --color-primaryHover: #8b6ef0;\n  --color-primaryActive: #6d4fd8;\n  --color-textMain: #ede9fe;\n  --color-textSub: #a29bc4;\n  --color-bg: #0f0d1a;\n  --color-surface: #1a1729;\n  --color-border: #2e2947;\n  --color-link: #6837fb;\n  --color-accent: #22d3ee;\n}",
    "cssUrl": "https://paletteget.com/zh/palette-list/web/an-ye-zi/index.css"
  }
}