colorFromColorInputChannelValue

function colorFromColorInputChannelValue<Model extends ColorInputModel>(
  color: Color,
  model: Model,
  channel: ColorInputChannelFor<Model>,
  value: number,
): Color;

OKLCH edits overwrite only that channel. RGB and HSL edits convert the edited color back to OKLCH; when the result is achromatic (a gray, black or white, or HSL saturation 0), it keeps color.h instead of the canonical achromatic hue 0 (see resolveIncomingRequested), so raising OKLCH chroma afterwards resumes that hue exactly.

HSL edits of an achromatic color with a stored hue start from the HSL hue that getColorInputChannelValue reports for it, not 0:

• Raising HSL saturation picks the HSL hue at which the new saturation and lightness have OKLCH hue color.h (to within 0.01°), so the gray turns back into its previous hue instead of red. Black and white stay achromatic and keep color.h.
• An HSL hue edit keeps the color achromatic and stores the OKLCH hue of the typed HSL hue, which the HSL hue field then reads back.
• Lightness and alpha edits keep color.h.

RGB edits away from a gray take whatever hue the new RGB values have.

value is not clamped; normalize it first with normalizeColorInputValue.

Parameters

colorColor

modelModel

channelColorInputChannelFor<Model>

valuenumber

Returns

Color

Throws

• When channel does not belong to model.

Example

import { parse, toHex } from '@pbroom/color-kit';
import { colorFromColorInputChannelValue } from '@pbroom/color-kit/driver';

const blue = parse('#3b82f6');
toHex(colorFromColorInputChannelValue(blue, 'rgb', 'r', 255)); // → '#ff82f6'
const gray = colorFromColorInputChannelValue(blue, 'hsl', 's', 0);
gray.c < 0.001; // → true
gray.h === blue.h; // → true