OKLCH — āļŠāļĩāļāļĩāđāđāļāđāļēāđāļāļŠāļēāļĒāļāļēāļāļāļĄāļēāļāļāļ§āđāļēāļāļĩāđāđāļāļĒ
āļĨāļāļāļāļķāļāļ āļēāļāļ§āđāļēāļāļļāļāļāļģāļĨāļąāļāļāļāļāđāļāļāļāļļāđāļĄāļāļāđāļ§āđāļāđāļāļāđ āđāļĨāļ°āļāļĒāļēāļāđāļŦāđāđāļāđāļĨāļ°āļāļļāđāļĄāļĄāļĩāļŠāļĩāļāđāļēāļāļāļąāļ āđāļāđāļĒāļąāļāļāļ “āļāļ§āļēāļĄāļĢāļđāđāļŠāļķāļ” āļāļĩāđāđāļŦāļĄāļ·āļāļāļāļąāļ — āđāļĄāđāđāļāđāļāļēāļāļāļļāđāļĄāļāļđāļŠāļ§āđāļēāļāđāļāļīāļāđāļ āļāļēāļāļāļļāđāļĄāļāļđāļŦāļĄāđāļ āļŦāļĢāļ·āļāļāļēāļāļāļļāđāļĄāļāļđāđāļāļāđāļāđāļāđāļāļīāļāļŦāļāđāļēāđāļāļ·āđāļāļ
āļāļąāđāļāļāļ·āļāļāļąāļāļŦāļēāļāļĩāđ OKLCH āđāļāđāļēāļĄāļēāđāļāđāđāļāđāļāļĒāđāļēāļāđāļāļĩāļĒāļāļāļēāļ
OKLCH āđāļāđāļāļĢāļ°āļāļāļŠāļĩāđāļŦāļĄāđāđāļ CSS āļāļĩāđāļāļāļāđāļāļāļĄāļēāđāļŦāđ “perceptually uniform” āļŦāļĢāļ·āļāļāđāļāļ·āļ āļŠāļĩāļāļĩāđāđāļāļĨāļĩāđāļĒāļāđāļāļāļĒāđāļēāļāļŠāļĄāđāļģāđāļŠāļĄāļāļāļēāļĄāļāļēāļĢāļĢāļąāļāļĢāļđāđāļāļāļāļŠāļēāļĒāļāļēāļĄāļāļļāļĐāļĒāđ āđāļĄāđāđāļāđāđāļāđāļāļąāļ§āđāļĨāļāđāļāļĢāļ°āļāļ RGB āļŦāļĢāļ·āļ HSL āļāļĩāđāļāļēāļāļāļĢāļąāđāļāđāļāļĨāļĩāđāļĒāļāđāļāđ 5 āļŦāļāđāļ§āļĒ āđāļāđāļāļĨāļąāļāļāļģāđāļŦāđāļŠāļĩāļāļđāđāļāļĨāļĩāđāļĒāļāđāļāļĄāļēāļāđāļāļīāļāļāļēāļ
OKLCH āļāļĢāļ°āļāļāļāļāđāļ§āļĒ 3 āļāđāļē:
- Lightness (L): āļāļ§āļēāļĄāļŠāļ§āđāļēāļ
- Chroma (C): āļāļ§āļēāļĄāđāļāđāļĄāļāļāļāļŠāļĩ
- Hue (H): āđāļāļāļŠāļĩ
āđāļĄāļ·āđāļāļāļļāļāđāļāļĨāļĩāđāļĒāļāđāļāļāļēāļ° Hue āđāļāļĒāļāļāļāđāļē L āđāļĨāļ° C āđāļ§āđ āļŠāļĩāļāļĩāđāđāļāđāļāļ°āļĄāļĩāļāļ§āļēāļĄāļŠāļ§āđāļēāļāđāļĨāļ°āļāļ§āļēāļĄāđāļāđāļĄāđāļāđāļēāļāļąāļ āļāđāļēāļāļāļąāļāđāļāđāđāļāļ — āļāļģāđāļŦāđāļŠāļĢāđāļēāļāļāļļāļāļŠāļĩāļāļĩāđ “āļĢāļđāđāļŠāļķāļāđāļāđāļēāļāļąāļ” āđāļāđāļāđāļēāļĒāļĄāļēāļ
āļāļāļāļāļēāļāļāļĩāđ OKLCH āļĒāļąāļāļāđāļ§āļĒāđāļŦāđāļāļēāļĢāļŠāļĢāđāļēāļ gradients āļāļđāļāļļāđāļĄāļāļ§āļĨāđāļĨāļ°āđāļāđāļāļāļĢāļĢāļĄāļāļēāļāļīāļāļ§āđāļē RGB āđāļāļĢāļēāļ°āļĄāļąāļāļāļģāļāļ§āļāļāļēāļāļāļ§āļēāļĄāļŠāļ§āđāļēāļ āļāļ§āļēāļĄāđāļāđāļĄ āđāļĨāļ°āđāļāļ āđāļĄāđāđāļāđāđāļāđāļāđāļēāļāļāļāđāļāļ āđāļāļĩāļĒāļ§ āļāđāļģāđāļāļīāļ
āđāļĨāļ°āļāļĩāđāļŠāļģāļāļąāļ OKLCH āļĢāļāļāļĢāļąāļāļŠāļĩāđāļ Display-P3 āļāļķāđāļāđāļāđāļāļāļāļāđāļāļāļŠāļĩāļāļĩāđāļāļ§āđāļēāļāļāļ§āđāļēāļŠāļģāļŦāļĢāļąāļāļŦāļāđāļēāļāļāļŠāļĄāļąāļĒāđāļŦāļĄāđ āđāļāđāļ MacBook āļŦāļĢāļ·āļ iPhone āļĢāļļāđāļāđāļŦāļĄāđ āļāļģāđāļŦāđāļŠāļĩāļāļđāļŠāļāđāļĨāļ°āđāļĄāđāļāļĒāļģāļĒāļīāđāļāļāļķāđāļ
āļŠāļĢāļļāļāđāļāļ·āđāļāļŦāļēāđāļāđāļāļŦāļąāļ§āļāđāļ
OKLCH āđāļāđāļāļĢāļ°āļāļāļŠāļĩāđāļŦāļĄāđāđāļ CSS āļāļĩāđāļāļāļāđāļāļāļĄāļēāđāļŦāđ perceptually uniform
āļāļĢāļ°āļāļāļāļāđāļ§āļĒ 3 āļāđāļē: Lightness, Chroma āđāļĨāļ° Hue
āļāļēāļĢāđāļāļĨāļĩāđāļĒāļāđāļāļāļēāļ° Hue āđāļāļĒāļāļāļāđāļē L āđāļĨāļ° C āļāļ°āđāļāđāļāļļāļāļŠāļĩāļāļĩāđāļĄāļĩāļāļ§āļēāļĄāļĢāļđāđāļŠāļķāļāđāļāđāļēāļāļąāļ
OKLCH āļāđāļ§āļĒāđāļŦāđ gradients āļāļđāļāļļāđāļĄāļāļ§āļĨāđāļĨāļ°āđāļĄāđāđāļāļīāļāļŠāļĩāđāļāļĨāļāļāļĨāļēāļāļāļēāļ
āļĢāļāļāļĢāļąāļāļŠāļĩāđāļ Display-P3 āļāļķāđāļāļĄāļĩāļāļāļāđāļāļāļāļ§āđāļēāļāļāļ§āđāļēāļŠāļĩ sRGB
OKLCH āļāļđāļāļāļģāļĄāļēāđāļāđāđāļ CSS Color Module Level 4 āđāļĨāļ°āļĢāļāļāļĢāļąāļāđāļāđāļāļĢāļēāļ§āđāđāļāļāļĢāđāļŠāļĄāļąāļĒāđāļŦāļĄāđ
āļŠāļēāļĄāļēāļĢāļāđāļāđ @supports āđāļ CSS āđāļāļ·āđāļ fallback āđāļāļĒāļąāļ sRGB āļŦāļēāļāđāļāļĢāļēāļ§āđāđāļāļāļĢāđāđāļĄāđāļĢāļāļāļĢāļąāļ
āļĄāļĩāđāļāļĢāļ·āđāļāļāļĄāļ·āļāļāđāļ§āļĒāļŠāļĢāđāļēāļāļāļēāđāļĨāļāļŠāļĩ OKLCH āđāļāđāļ oklch.fyi
OKLCH āđāļāđāļāļ·āđāļāļāļēāļāļāļēāļ OKLab āļāļķāđāļāđāļāđāļāđāļĄāđāļāļĨāļŠāļĩāļāļĩāđāđāļĄāđāļāļĒāļģāļāđāļāļāļēāļĢāļĢāļąāļāļĢāļđāđāļāļāļāļĄāļāļļāļĐāļĒāđ
āļāđāļāļĄāļđāļĨāđāļŠāļĢāļīāļĄāļāļēāļāļ āļēāļĒāļāļāļ
OKLCH āļāļđāļāđāļŠāļāļāđāļāļĒ Björn Ottosson āđāļāļāļĩ 2020 āđāļāļ·āđāļāđāļāđāļāļąāļāļŦāļēāļāļ§āļēāļĄāđāļĄāđāļŠāļĄāđāļģāđāļŠāļĄāļāļāļāļāļŠāļĩāđāļāļĢāļ°āļāļāđāļāļīāļĄ
Display-P3 āļĄāļĩāļāļāļāđāļāļāļŠāļĩāļĄāļēāļāļāļ§āđāļē sRGB āļāļķāļ 50% āđāļāļĒāđāļāļāļēāļ°āđāļāđāļāļāđāļāļāđāļĨāļ°āđāļāļĩāļĒāļ§
OKLCH āļŠāļēāļĄāļēāļĢāļāļāļģāļŦāļāļāļāđāļēāļāļĩāđāļāļĒāļđāđāļāļāļāļāļāļāđāļāļāļāļāļāļŦāļāđāļēāļāļāļāļĢāļīāļāđāļāđ āđāļāđāļāļ°āļāļđāļ “clip” āđāļŦāđāđāļāļĨāđāđāļāļĩāļĒāļāļāļĩāđāļŠāļļāļ
āļāļēāļĢāđāļāđ OKLCH āļāđāļ§āļĒāđāļŦāđāļāļēāļĢāļāļāļāđāļāļāđāļ§āđāļāđāļāđāļēāļāļķāļāļāļđāđāđāļāđāļāļĩāđāļĄāļĩāļāļ§āļēāļĄāļāļāļāļĢāđāļāļāļāļēāļāļāļēāļĢāļĄāļāļāđāļŦāđāļāđāļāđāļāļĩāļāļķāđāļ
https://jakub.kr/components/oklch-colors
āļĨāļāļāļāļķāļāļ āļēāļāļ§āđāļēāļāļļāļāļāļģāļĨāļąāļāļāļāļāđāļāļāļāļļāđāļĄāļāļāđāļ§āđāļāđāļāļāđ āđāļĨāļ°āļāļĒāļēāļāđāļŦāđāđāļāđāļĨāļ°āļāļļāđāļĄāļĄāļĩāļŠāļĩāļāđāļēāļāļāļąāļ āđāļāđāļĒāļąāļāļāļ “āļāļ§āļēāļĄāļĢāļđāđāļŠāļķāļ” āļāļĩāđāđāļŦāļĄāļ·āļāļāļāļąāļ — āđāļĄāđāđāļāđāļāļēāļāļāļļāđāļĄāļāļđāļŠāļ§āđāļēāļāđāļāļīāļāđāļ āļāļēāļāļāļļāđāļĄāļāļđāļŦāļĄāđāļ āļŦāļĢāļ·āļāļāļēāļāļāļļāđāļĄāļāļđāđāļāļāđāļāđāļāđāļāļīāļāļŦāļāđāļēāđāļāļ·āđāļāļ
āļāļąāđāļāļāļ·āļāļāļąāļāļŦāļēāļāļĩāđ OKLCH āđāļāđāļēāļĄāļēāđāļāđāđāļāđāļāļĒāđāļēāļāđāļāļĩāļĒāļāļāļēāļ
OKLCH āđāļāđāļāļĢāļ°āļāļāļŠāļĩāđāļŦāļĄāđāđāļ CSS āļāļĩāđāļāļāļāđāļāļāļĄāļēāđāļŦāđ “perceptually uniform” āļŦāļĢāļ·āļāļāđāļāļ·āļ āļŠāļĩāļāļĩāđāđāļāļĨāļĩāđāļĒāļāđāļāļāļĒāđāļēāļāļŠāļĄāđāļģāđāļŠāļĄāļāļāļēāļĄāļāļēāļĢāļĢāļąāļāļĢāļđāđāļāļāļāļŠāļēāļĒāļāļēāļĄāļāļļāļĐāļĒāđ āđāļĄāđāđāļāđāđāļāđāļāļąāļ§āđāļĨāļāđāļāļĢāļ°āļāļ RGB āļŦāļĢāļ·āļ HSL āļāļĩāđāļāļēāļāļāļĢāļąāđāļāđāļāļĨāļĩāđāļĒāļāđāļāđ 5 āļŦāļāđāļ§āļĒ āđāļāđāļāļĨāļąāļāļāļģāđāļŦāđāļŠāļĩāļāļđāđāļāļĨāļĩāđāļĒāļāđāļāļĄāļēāļāđāļāļīāļāļāļēāļ
OKLCH āļāļĢāļ°āļāļāļāļāđāļ§āļĒ 3 āļāđāļē:
- Lightness (L): āļāļ§āļēāļĄāļŠāļ§āđāļēāļ
- Chroma (C): āļāļ§āļēāļĄāđāļāđāļĄāļāļāļāļŠāļĩ
- Hue (H): āđāļāļāļŠāļĩ
āđāļĄāļ·āđāļāļāļļāļāđāļāļĨāļĩāđāļĒāļāđāļāļāļēāļ° Hue āđāļāļĒāļāļāļāđāļē L āđāļĨāļ° C āđāļ§āđ āļŠāļĩāļāļĩāđāđāļāđāļāļ°āļĄāļĩāļāļ§āļēāļĄāļŠāļ§āđāļēāļāđāļĨāļ°āļāļ§āļēāļĄāđāļāđāļĄāđāļāđāļēāļāļąāļ āļāđāļēāļāļāļąāļāđāļāđāđāļāļ — āļāļģāđāļŦāđāļŠāļĢāđāļēāļāļāļļāļāļŠāļĩāļāļĩāđ “āļĢāļđāđāļŠāļķāļāđāļāđāļēāļāļąāļ” āđāļāđāļāđāļēāļĒāļĄāļēāļ
āļāļāļāļāļēāļāļāļĩāđ OKLCH āļĒāļąāļāļāđāļ§āļĒāđāļŦāđāļāļēāļĢāļŠāļĢāđāļēāļ gradients āļāļđāļāļļāđāļĄāļāļ§āļĨāđāļĨāļ°āđāļāđāļāļāļĢāļĢāļĄāļāļēāļāļīāļāļ§āđāļē RGB āđāļāļĢāļēāļ°āļĄāļąāļāļāļģāļāļ§āļāļāļēāļāļāļ§āļēāļĄāļŠāļ§āđāļēāļ āļāļ§āļēāļĄāđāļāđāļĄ āđāļĨāļ°āđāļāļ āđāļĄāđāđāļāđāđāļāđāļāđāļēāļāļāļāđāļāļ āđāļāļĩāļĒāļ§ āļāđāļģāđāļāļīāļ
āđāļĨāļ°āļāļĩāđāļŠāļģāļāļąāļ OKLCH āļĢāļāļāļĢāļąāļāļŠāļĩāđāļ Display-P3 āļāļķāđāļāđāļāđāļāļāļāļāđāļāļāļŠāļĩāļāļĩāđāļāļ§āđāļēāļāļāļ§āđāļēāļŠāļģāļŦāļĢāļąāļāļŦāļāđāļēāļāļāļŠāļĄāļąāļĒāđāļŦāļĄāđ āđāļāđāļ MacBook āļŦāļĢāļ·āļ iPhone āļĢāļļāđāļāđāļŦāļĄāđ āļāļģāđāļŦāđāļŠāļĩāļāļđāļŠāļāđāļĨāļ°āđāļĄāđāļāļĒāļģāļĒāļīāđāļāļāļķāđāļ
āļŠāļĢāļļāļāđāļāļ·āđāļāļŦāļēāđāļāđāļāļŦāļąāļ§āļāđāļ
OKLCH āđāļāđāļāļĢāļ°āļāļāļŠāļĩāđāļŦāļĄāđāđāļ CSS āļāļĩāđāļāļāļāđāļāļāļĄāļēāđāļŦāđ perceptually uniform
āļāļĢāļ°āļāļāļāļāđāļ§āļĒ 3 āļāđāļē: Lightness, Chroma āđāļĨāļ° Hue
āļāļēāļĢāđāļāļĨāļĩāđāļĒāļāđāļāļāļēāļ° Hue āđāļāļĒāļāļāļāđāļē L āđāļĨāļ° C āļāļ°āđāļāđāļāļļāļāļŠāļĩāļāļĩāđāļĄāļĩāļāļ§āļēāļĄāļĢāļđāđāļŠāļķāļāđāļāđāļēāļāļąāļ
OKLCH āļāđāļ§āļĒāđāļŦāđ gradients āļāļđāļāļļāđāļĄāļāļ§āļĨāđāļĨāļ°āđāļĄāđāđāļāļīāļāļŠāļĩāđāļāļĨāļāļāļĨāļēāļāļāļēāļ
āļĢāļāļāļĢāļąāļāļŠāļĩāđāļ Display-P3 āļāļķāđāļāļĄāļĩāļāļāļāđāļāļāļāļ§āđāļēāļāļāļ§āđāļēāļŠāļĩ sRGB
OKLCH āļāļđāļāļāļģāļĄāļēāđāļāđāđāļ CSS Color Module Level 4 āđāļĨāļ°āļĢāļāļāļĢāļąāļāđāļāđāļāļĢāļēāļ§āđāđāļāļāļĢāđāļŠāļĄāļąāļĒāđāļŦāļĄāđ
āļŠāļēāļĄāļēāļĢāļāđāļāđ @supports āđāļ CSS āđāļāļ·āđāļ fallback āđāļāļĒāļąāļ sRGB āļŦāļēāļāđāļāļĢāļēāļ§āđāđāļāļāļĢāđāđāļĄāđāļĢāļāļāļĢāļąāļ
āļĄāļĩāđāļāļĢāļ·āđāļāļāļĄāļ·āļāļāđāļ§āļĒāļŠāļĢāđāļēāļāļāļēāđāļĨāļāļŠāļĩ OKLCH āđāļāđāļ oklch.fyi
OKLCH āđāļāđāļāļ·āđāļāļāļēāļāļāļēāļ OKLab āļāļķāđāļāđāļāđāļāđāļĄāđāļāļĨāļŠāļĩāļāļĩāđāđāļĄāđāļāļĒāļģāļāđāļāļāļēāļĢāļĢāļąāļāļĢāļđāđāļāļāļāļĄāļāļļāļĐāļĒāđ
āļāđāļāļĄāļđāļĨāđāļŠāļĢāļīāļĄāļāļēāļāļ āļēāļĒāļāļāļ
OKLCH āļāļđāļāđāļŠāļāļāđāļāļĒ Björn Ottosson āđāļāļāļĩ 2020 āđāļāļ·āđāļāđāļāđāļāļąāļāļŦāļēāļāļ§āļēāļĄāđāļĄāđāļŠāļĄāđāļģāđāļŠāļĄāļāļāļāļāļŠāļĩāđāļāļĢāļ°āļāļāđāļāļīāļĄ
Display-P3 āļĄāļĩāļāļāļāđāļāļāļŠāļĩāļĄāļēāļāļāļ§āđāļē sRGB āļāļķāļ 50% āđāļāļĒāđāļāļāļēāļ°āđāļāđāļāļāđāļāļāđāļĨāļ°āđāļāļĩāļĒāļ§
OKLCH āļŠāļēāļĄāļēāļĢāļāļāļģāļŦāļāļāļāđāļēāļāļĩāđāļāļĒāļđāđāļāļāļāļāļāļāđāļāļāļāļāļāļŦāļāđāļēāļāļāļāļĢāļīāļāđāļāđ āđāļāđāļāļ°āļāļđāļ “clip” āđāļŦāđāđāļāļĨāđāđāļāļĩāļĒāļāļāļĩāđāļŠāļļāļ
āļāļēāļĢāđāļāđ OKLCH āļāđāļ§āļĒāđāļŦāđāļāļēāļĢāļāļāļāđāļāļāđāļ§āđāļāđāļāđāļēāļāļķāļāļāļđāđāđāļāđāļāļĩāđāļĄāļĩāļāļ§āļēāļĄāļāļāļāļĢāđāļāļāļāļēāļāļāļēāļĢāļĄāļāļāđāļŦāđāļāđāļāđāļāļĩāļāļķāđāļ
https://jakub.kr/components/oklch-colors
ðïļ OKLCH — āļŠāļĩāļāļĩāđāđāļāđāļēāđāļāļŠāļēāļĒāļāļēāļāļāļĄāļēāļāļāļ§āđāļēāļāļĩāđāđāļāļĒ
āļĨāļāļāļāļķāļāļ āļēāļāļ§āđāļēāļāļļāļāļāļģāļĨāļąāļāļāļāļāđāļāļāļāļļāđāļĄāļāļāđāļ§āđāļāđāļāļāđ āđāļĨāļ°āļāļĒāļēāļāđāļŦāđāđāļāđāļĨāļ°āļāļļāđāļĄāļĄāļĩāļŠāļĩāļāđāļēāļāļāļąāļ āđāļāđāļĒāļąāļāļāļ “āļāļ§āļēāļĄāļĢāļđāđāļŠāļķāļ” āļāļĩāđāđāļŦāļĄāļ·āļāļāļāļąāļ — āđāļĄāđāđāļāđāļāļēāļāļāļļāđāļĄāļāļđāļŠāļ§āđāļēāļāđāļāļīāļāđāļ āļāļēāļāļāļļāđāļĄāļāļđāļŦāļĄāđāļ āļŦāļĢāļ·āļāļāļēāļāļāļļāđāļĄāļāļđāđāļāļāđāļāđāļāđāļāļīāļāļŦāļāđāļēāđāļāļ·āđāļāļ
āļāļąāđāļāļāļ·āļāļāļąāļāļŦāļēāļāļĩāđ OKLCH āđāļāđāļēāļĄāļēāđāļāđāđāļāđāļāļĒāđāļēāļāđāļāļĩāļĒāļāļāļēāļ
OKLCH āđāļāđāļāļĢāļ°āļāļāļŠāļĩāđāļŦāļĄāđāđāļ CSS āļāļĩāđāļāļāļāđāļāļāļĄāļēāđāļŦāđ “perceptually uniform” āļŦāļĢāļ·āļāļāđāļāļ·āļ āļŠāļĩāļāļĩāđāđāļāļĨāļĩāđāļĒāļāđāļāļāļĒāđāļēāļāļŠāļĄāđāļģāđāļŠāļĄāļāļāļēāļĄāļāļēāļĢāļĢāļąāļāļĢāļđāđāļāļāļāļŠāļēāļĒāļāļēāļĄāļāļļāļĐāļĒāđ āđāļĄāđāđāļāđāđāļāđāļāļąāļ§āđāļĨāļāđāļāļĢāļ°āļāļ RGB āļŦāļĢāļ·āļ HSL āļāļĩāđāļāļēāļāļāļĢāļąāđāļāđāļāļĨāļĩāđāļĒāļāđāļāđ 5 āļŦāļāđāļ§āļĒ āđāļāđāļāļĨāļąāļāļāļģāđāļŦāđāļŠāļĩāļāļđāđāļāļĨāļĩāđāļĒāļāđāļāļĄāļēāļāđāļāļīāļāļāļēāļ
OKLCH āļāļĢāļ°āļāļāļāļāđāļ§āļĒ 3 āļāđāļē:
- Lightness (L): āļāļ§āļēāļĄāļŠāļ§āđāļēāļ
- Chroma (C): āļāļ§āļēāļĄāđāļāđāļĄāļāļāļāļŠāļĩ
- Hue (H): āđāļāļāļŠāļĩ
āđāļĄāļ·āđāļāļāļļāļāđāļāļĨāļĩāđāļĒāļāđāļāļāļēāļ° Hue āđāļāļĒāļāļāļāđāļē L āđāļĨāļ° C āđāļ§āđ āļŠāļĩāļāļĩāđāđāļāđāļāļ°āļĄāļĩāļāļ§āļēāļĄāļŠāļ§āđāļēāļāđāļĨāļ°āļāļ§āļēāļĄāđāļāđāļĄāđāļāđāļēāļāļąāļ āļāđāļēāļāļāļąāļāđāļāđāđāļāļ — āļāļģāđāļŦāđāļŠāļĢāđāļēāļāļāļļāļāļŠāļĩāļāļĩāđ “āļĢāļđāđāļŠāļķāļāđāļāđāļēāļāļąāļ” āđāļāđāļāđāļēāļĒāļĄāļēāļ
āļāļāļāļāļēāļāļāļĩāđ OKLCH āļĒāļąāļāļāđāļ§āļĒāđāļŦāđāļāļēāļĢāļŠāļĢāđāļēāļ gradients āļāļđāļāļļāđāļĄāļāļ§āļĨāđāļĨāļ°āđāļāđāļāļāļĢāļĢāļĄāļāļēāļāļīāļāļ§āđāļē RGB āđāļāļĢāļēāļ°āļĄāļąāļāļāļģāļāļ§āļāļāļēāļāļāļ§āļēāļĄāļŠāļ§āđāļēāļ āļāļ§āļēāļĄāđāļāđāļĄ āđāļĨāļ°āđāļāļ āđāļĄāđāđāļāđāđāļāđāļāđāļēāļāļāļāđāļāļ āđāļāļĩāļĒāļ§ āļāđāļģāđāļāļīāļ
āđāļĨāļ°āļāļĩāđāļŠāļģāļāļąāļ OKLCH āļĢāļāļāļĢāļąāļāļŠāļĩāđāļ Display-P3 āļāļķāđāļāđāļāđāļāļāļāļāđāļāļāļŠāļĩāļāļĩāđāļāļ§āđāļēāļāļāļ§āđāļēāļŠāļģāļŦāļĢāļąāļāļŦāļāđāļēāļāļāļŠāļĄāļąāļĒāđāļŦāļĄāđ āđāļāđāļ MacBook āļŦāļĢāļ·āļ iPhone āļĢāļļāđāļāđāļŦāļĄāđ āļāļģāđāļŦāđāļŠāļĩāļāļđāļŠāļāđāļĨāļ°āđāļĄāđāļāļĒāļģāļĒāļīāđāļāļāļķāđāļ
ð āļŠāļĢāļļāļāđāļāļ·āđāļāļŦāļēāđāļāđāļāļŦāļąāļ§āļāđāļ
âĄïļ OKLCH āđāļāđāļāļĢāļ°āļāļāļŠāļĩāđāļŦāļĄāđāđāļ CSS āļāļĩāđāļāļāļāđāļāļāļĄāļēāđāļŦāđ perceptually uniform
âĄïļ āļāļĢāļ°āļāļāļāļāđāļ§āļĒ 3 āļāđāļē: Lightness, Chroma āđāļĨāļ° Hue
âĄïļ āļāļēāļĢāđāļāļĨāļĩāđāļĒāļāđāļāļāļēāļ° Hue āđāļāļĒāļāļāļāđāļē L āđāļĨāļ° C āļāļ°āđāļāđāļāļļāļāļŠāļĩāļāļĩāđāļĄāļĩāļāļ§āļēāļĄāļĢāļđāđāļŠāļķāļāđāļāđāļēāļāļąāļ
âĄïļ OKLCH āļāđāļ§āļĒāđāļŦāđ gradients āļāļđāļāļļāđāļĄāļāļ§āļĨāđāļĨāļ°āđāļĄāđāđāļāļīāļāļŠāļĩāđāļāļĨāļāļāļĨāļēāļāļāļēāļ
âĄïļ āļĢāļāļāļĢāļąāļāļŠāļĩāđāļ Display-P3 āļāļķāđāļāļĄāļĩāļāļāļāđāļāļāļāļ§āđāļēāļāļāļ§āđāļēāļŠāļĩ sRGB
âĄïļ OKLCH āļāļđāļāļāļģāļĄāļēāđāļāđāđāļ CSS Color Module Level 4 āđāļĨāļ°āļĢāļāļāļĢāļąāļāđāļāđāļāļĢāļēāļ§āđāđāļāļāļĢāđāļŠāļĄāļąāļĒāđāļŦāļĄāđ
âĄïļ āļŠāļēāļĄāļēāļĢāļāđāļāđ @supports āđāļ CSS āđāļāļ·āđāļ fallback āđāļāļĒāļąāļ sRGB āļŦāļēāļāđāļāļĢāļēāļ§āđāđāļāļāļĢāđāđāļĄāđāļĢāļāļāļĢāļąāļ
âĄïļ āļĄāļĩāđāļāļĢāļ·āđāļāļāļĄāļ·āļāļāđāļ§āļĒāļŠāļĢāđāļēāļāļāļēāđāļĨāļāļŠāļĩ OKLCH āđāļāđāļ oklch.fyi
âĄïļ OKLCH āđāļāđāļāļ·āđāļāļāļēāļāļāļēāļ OKLab āļāļķāđāļāđāļāđāļāđāļĄāđāļāļĨāļŠāļĩāļāļĩāđāđāļĄāđāļāļĒāļģāļāđāļāļāļēāļĢāļĢāļąāļāļĢāļđāđāļāļāļāļĄāļāļļāļĐāļĒāđ
â
āļāđāļāļĄāļđāļĨāđāļŠāļĢāļīāļĄāļāļēāļāļ āļēāļĒāļāļāļ
âĄïļ OKLCH āļāļđāļāđāļŠāļāļāđāļāļĒ Björn Ottosson āđāļāļāļĩ 2020 āđāļāļ·āđāļāđāļāđāļāļąāļāļŦāļēāļāļ§āļēāļĄāđāļĄāđāļŠāļĄāđāļģāđāļŠāļĄāļāļāļāļāļŠāļĩāđāļāļĢāļ°āļāļāđāļāļīāļĄ
âĄïļ Display-P3 āļĄāļĩāļāļāļāđāļāļāļŠāļĩāļĄāļēāļāļāļ§āđāļē sRGB āļāļķāļ 50% āđāļāļĒāđāļāļāļēāļ°āđāļāđāļāļāđāļāļāđāļĨāļ°āđāļāļĩāļĒāļ§
âĄïļ OKLCH āļŠāļēāļĄāļēāļĢāļāļāļģāļŦāļāļāļāđāļēāļāļĩāđāļāļĒāļđāđāļāļāļāļāļāļāđāļāļāļāļāļāļŦāļāđāļēāļāļāļāļĢāļīāļāđāļāđ āđāļāđāļāļ°āļāļđāļ “clip” āđāļŦāđāđāļāļĨāđāđāļāļĩāļĒāļāļāļĩāđāļŠāļļāļ
âĄïļ āļāļēāļĢāđāļāđ OKLCH āļāđāļ§āļĒāđāļŦāđāļāļēāļĢāļāļāļāđāļāļāđāļ§āđāļāđāļāđāļēāļāļķāļāļāļđāđāđāļāđāļāļĩāđāļĄāļĩāļāļ§āļēāļĄāļāļāļāļĢāđāļāļāļāļēāļāļāļēāļĢāļĄāļāļāđāļŦāđāļāđāļāđāļāļĩāļāļķāđāļ
https://jakub.kr/components/oklch-colors
0 Comments
0 Shares
50 Views
0 Reviews