GiC (Gestalten in Code) Lang

Back to examples

OKLCH Triadic

OKLCH Triadic thumbnail

Adapted from HSB, created by Fabian Morón Zirfas.

Three equal vertical fields hold chroma and lightness constant while shifting hue by 120 degrees. The study isolates hue contrast through fixed CSS colors and a simple triptych structure.

// ABOUTME: Fills the canvas with three fixed, hue-separated vertical color fields.
// ABOUTME: Shows a triadic color selection by shifting the hue by 120 degrees.
// Adapted from HSB by Fabian Morón Zirfas:
// https://github.com/ff6347/gestalten-in-code/tree/e8b8f8446c13c01494ccfd1e92ce2bb1638daf66/color/p5js/hsb
background("white");
noStroke();
let hue = 120;
fill(81, 39, hue);
rect(0, 0, 100 / 3, 100);
hue = hue + 120;
fill(81, 39, hue);
rect(100 / 3, 0, 100 / 3, 100);
hue = hue + 120;
fill(81, 39, 360);
rect(200 / 3, 0, 100 / 3, 100);