Vixen
02b45cc4
csharp
public readonly record struct Oklab

A colour in Oklab: perceptual lightness, and two opponent axes.

No guide page documents this yet — the page shows what the code says about itself.

Remarks

The space to interpolate colours in, and the reason is one specific failure. Fading from blue to yellow in linear RGB passes through a muddy grey, and fading from blue to white in sRGB visibly detours through purple — because neither space is arranged so that equal numeric steps are equal perceptual steps. Oklab is, near enough, and it is the reason a gradient or a colour transition in this engine looks like the one the designer drew.

Björn Ottosson's 2020 derivation. It is not a rediscovery of CIELAB: it fits the same cone-response-then-cube-root shape to better data, and its hue lines stay straight, which is what stops a blue→white fade bending towards purple. Cheap enough to do per frame — two 3×3 matrices and three cube roots each way.

The input is linear. Feeding sRGB-encoded values in produces something that is not Oklab and does not have any of the properties it is being used for. See ColorSpace for why that is the easiest mistake in colour handling to make and the hardest to see.

Fields and properties (3)

  • public float L

    Lightness, 0 at black and 1 at white.

  • public float A

    Green to red.

  • public float B

    Blue to yellow.

Methods (5)

  • public Oklab(float L, float A, float B)

    A colour in Oklab: perceptual lightness, and two opponent axes.

  • public static Oklab FromLinear(Vector3 linear)

    Converts a linear RGB colour to Oklab.

  • public Vector3 ToLinear()

    Converts back to linear RGB.

  • public static Oklab Lerp(Oklab from, Oklab to, float amount)

    Interpolates between two Oklab colours.

  • public static Color4 Lerp(Color4 from, Color4 to, float amount)

    Interpolates two linear colours perceptually, alpha included.

Used by (4)

  • GradientVixen.Ui.Controls.Advanced
  • OkLchVixen.Ui.Controls.Advanced
  • OklabTestsVixen.Core.Mathematics.Tests
  • StyleValueVixen.Ui.Styling