Light → DarkOKLCH · contrast-match

输入浅色模式的前景色 A、背景色 B,以及深色模式的背景色 D。程序会在 OKLCH 空间内保持 A 的 Chroma / Hue,仅调整 Lightness,使得 C 与 D 的 APCA 对比度(幅度)等于 A 与 B 的 APCA 对比度。

L · C · H → L' · C · H

01 输入颜色

浅色模式 · 前景色 A
oklch(29.03% 0.016 264.54)
浅色模式 · 背景色 B
oklch(100.00% 0 0)
深色模式 · 背景色 D
oklch(18.37% 0.006 264.54)
深色前景 C 的 Lightness 相对 A
深底 D 选更亮、浅底 D 选更暗,让 C 与 D 保持反差。
约束:
  |APCA(C, D)| == |APCA(A, B)|
  Chroma(C) = Chroma(A)    Hue(C) = Hue(A)
  Lightness(C) 由方向(更亮/更暗/自动)选择

02 效果预览

Light · A on B
The quiet afternoon
lingered in gold.
这是一段用于感受浅色模式下 A / B 实际可读性的样例文本。
#1f2328 #ffffff
Dark · C on D
The quiet afternoon
lingered in gold.
程序自动求得了前景色 C:保持 A 的色相和饱和度,调整明度以匹配原对比度。

计算结果 · 深色前景色 C

匹配中…
HEX
OKLCH
Lightness Δ
Chromaticity
浅色 contrast(A, B)
深色 contrast(C, D)