← Back to functions

CSS Function

oklch()

Color

Defines a color using the perceptually uniform OKLCh color space — lightness, chroma, and hue.

Syntax

oklch(lightness chroma hue)

Example

color: oklch(0.8 0.2 160);

Common use cases

  • Perceptually consistent color palettes
  • Accessible color systems
  • Wide-gamut colors on modern displays

Practical developer insight

oklch() is the modern choice for color systems — unlike hsl(), equal steps in lightness look equally different to the human eye. Ideal for design tokens.

Related