Match sRGB to named color color-mix()Chromatic adaptationColor matrix calculatorTowards reference ranges for unbounded color componentsChroma premultiplicationColor vision deficiency simulationHue interpolation fixupBlend modes in culoriNearest color, gazillion-colors editionNearest CSS named colorsCulori scales testThe DIN99o Color SpaceColor difference formulas
Chroma vs. RGB clamping for the CIELCh color space
function fixupBisect(c) {
// if the color is displayable, return it directly
if (c.displayable()) return c;
// try with chroma=0
var clamped = hcl(c.h, 0, c.l);
// if not even chroma=0 is displayable
// fall back to RGB clamping
if (!clamped.displayable()) return clamped;
// By this time we know chroma=0 is displayable and our current chroma is not.
// Find the displayable chroma through the bisection method.
var start = 0, end = c.c, delta = 0.01;
// Keep track of iterations to measure performance
mutable iterations = 0;
while (end - start > delta) {
clamped.c = start + (end - start) * 0.5;
if (clamped.displayable()) start = clamped.c;
else end = clamped.c;
mutable iterations++;
};
return clamped;
}
function fixupLinear(c) {
let delta = 0.01;
while (!c.displayable() && c.c >= delta) c.c -= delta;
return c;
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
