- 将HSL颜色模型替换为OKLCH,实现感知均匀的颜色过渡 - 基于提取的主色调浅色版本生成11个色阶,浅色居中显示 - 左侧5个更浅色阶,右侧5个更深色阶,亮度间隔±0.08 OKLCH优势: - 感知上均匀的亮度过渡,避免视觉跳跃 - 保持色相(H)和色度(C)恒定,确保同色系 - 深色和浅色区域过渡更自然平滑 - 符合人眼对颜色差异的实际感知 色阶生成流程: 1. ColorThief提取图片主色调(RGB) 2. 转换为OKLCH,生成高亮度(L=0.92)浅色版本 3. 基于浅色背景生成11个感知均匀的色阶 4. 在页面标题栏中间显示,支持快速切换 技术实现: - 实现完整的Hex ↔ OKLCH双向转换 - 转换路径:Hex → sRGB → 线性RGB → OKLab → OKLCH - 更新rgbToLightPastel函数使用OKLCH生成浅色
jingrowtools
Description
Languages
Vue
85.1%
TypeScript
10.8%
JavaScript
3.8%
CSS
0.2%