jiang
617ba4d87c
Derive the gem-blue palette with OKLCH tonal and complementary-color rules while preserving acrylic opacity, blur and surface hierarchy. Darker focus tokens exposed stacked field rings, fallback outlines and persistent basemap selection rings. Keep fallback focus styles in the base layer and use one themed field boundary or inset card stroke. Preserve keyboard focus, invalid states and native input semantics. Add browser regression coverage for pointer and keyboard focus, all basemap presentations, narrow layouts and rendered contrast. Validation in an isolated checkout: pnpm lint, pnpm typecheck, pnpm test (393 tests), focused browser suites and pnpm build.
28 lines
2.4 KiB
XML
28 lines
2.4 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" width="1120" height="490" viewBox="0 0 1120 490">
|
|
<rect width="1120" height="490" fill="#F5F7FA"/>
|
|
<g font-family="Noto Sans SC Variable,Noto Sans CJK SC,Microsoft YaHei,sans-serif" fill="#232935">
|
|
<text x="32" y="46" font-size="24" font-weight="600">宝石蓝 · 银灰亚克力</text>
|
|
<text x="32" y="76" font-size="14" fill="#4E5566">同色相色阶 + 低彩度互补色 · 色板为不透明基准，亚克力透明度独立设置</text>
|
|
<rect x="32" y="102" width="192" height="236" rx="8" fill="#4263C7" stroke="#BEC2CD"/>
|
|
<text x="32" y="373" font-size="20" font-family="Consolas,monospace">#4263C7</text>
|
|
<text x="32" y="402" font-size="16">宝石蓝 · 主操作 · 品牌</text>
|
|
<text x="32" y="430" font-size="12" fill="#4E5566" font-family="Consolas,monospace">L 0.529 C 0.160 h 267.06</text>
|
|
<rect x="248" y="102" width="192" height="236" rx="8" fill="#E6E9F2" stroke="#BEC2CD"/>
|
|
<text x="248" y="373" font-size="20" font-family="Consolas,monospace">#E6E9F2</text>
|
|
<text x="248" y="402" font-size="16">银霜 · 亚克力材质</text>
|
|
<text x="248" y="430" font-size="12" fill="#4E5566" font-family="Consolas,monospace">L 0.935 C 0.012 h 267.06</text>
|
|
<rect x="464" y="102" width="192" height="236" rx="8" fill="#F5F7FA" stroke="#BEC2CD"/>
|
|
<text x="464" y="373" font-size="20" font-family="Consolas,monospace">#F5F7FA</text>
|
|
<text x="464" y="402" font-size="16">冷瓷 · 阅读 · 表单</text>
|
|
<text x="464" y="430" font-size="12" fill="#4E5566" font-family="Consolas,monospace">L 0.975 C 0.005 h 267.06</text>
|
|
<rect x="680" y="102" width="192" height="236" rx="8" fill="#D6C294" stroke="#BEC2CD"/>
|
|
<text x="680" y="373" font-size="20" font-family="Consolas,monospace">#D6C294</text>
|
|
<text x="680" y="402" font-size="16">香槟 · 互补暖色点缀</text>
|
|
<text x="680" y="430" font-size="12" fill="#4E5566" font-family="Consolas,monospace">L 0.820 C 0.065 h 87.06</text>
|
|
<rect x="896" y="102" width="192" height="236" rx="8" fill="#232935" stroke="#BEC2CD"/>
|
|
<text x="896" y="373" font-size="20" font-family="Consolas,monospace">#232935</text>
|
|
<text x="896" y="402" font-size="16">深墨 · 标题 · 正文</text>
|
|
<text x="896" y="430" font-size="12" fill="#4E5566" font-family="Consolas,monospace">L 0.280 C 0.025 h 267.06</text>
|
|
<text x="32" y="468" font-size="13" fill="#4E5566">主色 h = 267.06°；同色色阶保持 h；香槟色 h = (267.06° + 180°) mod 360° = 87.06°</text>
|
|
</g></svg>
|