97 字
1 分钟
OKLCH 颜色空间入门
OKLCH 是感知均匀的颜色空间,改变亮度时色相不会偏移。
语法
color: oklch(L C H);/* L: 亮度 0~1, C: 彩度 0~0.4, H: 色相角度 0~360 */
color: oklch(0.7 0.15 250); /* 蓝紫色 */color: oklch(0.55 0.12 55); /* 琥珀色 */对比 HSL
HSL 中蓝色和黄色相同亮度值,视觉亮度差异巨大;OKLCH 修正了这一问题。
生成调色板
同一 L 值、不同 H 值 → 视觉亮度一致的多色调色板,非常适合主题设计。
分享
如果这篇文章对你有帮助,欢迎分享给更多人!
OKLCH 颜色空间入门
https://example.pages.dev/posts/test-css-oklch/ 部分信息可能已经过时
相关文章 智能推荐
1
用 CSS 变量实现多主题切换
博客搭建/主题定制 通过 CSS 自定义属性和类名切换,实现亮色、暗色、羊皮纸三套主题。
2
博客排版优化实践
博客搭建/主题定制 字体选择、行高、字间距——让中文博客读起来更舒服。
3
TypeScript 泛型实战
技术笔记/TypeScript 从基础泛型到条件类型,解锁类型系统的真正威力。
4
Cloudflare Workers 入门
博客搭建/Cloudflare 用 Cloudflare Workers 在边缘运行 JavaScript,延迟低至毫秒级。
5
UE5 渲染管线 01:线程模型、Scene Proxy 与一帧延迟
图形学/Unreal Engine 跟踪 UPrimitiveComponent 如何进入 FScene,区分 Game、Render、RHI Thread 的数据所有权,并用源码断点与 Unreal Insights 验证跨线程更新和帧延迟。
随机文章 随机推荐
1
UE5 渲染管线 02:InitViews、可见性与 Mesh Drawing Pipeline
图形学/Unreal Engine 2026-07-16
2
UE5 渲染管线 01:线程模型、Scene Proxy 与一帧延迟
图形学/Unreal Engine 2026-07-16
3
UE5 渲染管线 03:RDG 资源生命周期、Barrier 与异步计算
图形学/Unreal Engine 2026-07-16
4
UE5 渲染管线 05:Nanite Cluster、双阶段遮挡与虚拟化几何
图形学/Unreal Engine 2026-07-16
5
用 CSS 变量实现多主题切换
博客搭建/主题定制 2026-05-20






