UNPKG

@materialx/material-color-utilities

Version:

Algorithms and utilities that power the Material Design 3 (M3) color system, including choosing theme colors from images and creating tones of colors; all in a new color space.

1,571 lines 238 kB
//#region ../../../node_modules/@material/material-color-utilities/dist/index.js /** * @license * Copyright 2021 Google LLC * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Utility methods for mathematical operations. */ /** * The signum function. * * @return 1 if num > 0, -1 if num < 0, and 0 if num = 0 */ function signum(num) { if (num < 0) return -1; else if (num === 0) return 0; else return 1; } /** * The linear interpolation function. * * @return start if amount = 0 and stop if amount = 1 */ function lerp(start, stop, amount) { return (1 - amount) * start + amount * stop; } /** * Clamps an integer between two integers. * * @return input when min <= input <= max, and either min or max * otherwise. */ function clampInt(min, max, input) { if (input < min) return min; else if (input > max) return max; return input; } /** * Clamps an integer between two floating-point numbers. * * @return input when min <= input <= max, and either min or max * otherwise. */ function clampDouble(min, max, input) { if (input < min) return min; else if (input > max) return max; return input; } /** * Sanitizes a degree measure as an integer. * * @return a degree measure between 0 (inclusive) and 360 * (exclusive). */ function sanitizeDegreesInt(degrees) { degrees = degrees % 360; if (degrees < 0) degrees = degrees + 360; return degrees; } /** * Sanitizes a degree measure as a floating-point number. * * @return a degree measure between 0.0 (inclusive) and 360.0 * (exclusive). */ function sanitizeDegreesDouble(degrees) { degrees = degrees % 360; if (degrees < 0) degrees = degrees + 360; return degrees; } /** * Sign of direction change needed to travel from one angle to * another. * * For angles that are 180 degrees apart from each other, both * directions have the same travel distance, so either direction is * shortest. The value 1.0 is returned in this case. * * @param from The angle travel starts from, in degrees. * @param to The angle travel ends at, in degrees. * @return -1 if decreasing from leads to the shortest travel * distance, 1 if increasing from leads to the shortest travel * distance. */ function rotationDirection(from, to) { const increasingDifference = sanitizeDegreesDouble(to - from); return increasingDifference <= 180 ? 1 : -1; } /** * Distance of two points on a circle, represented using degrees. */ function differenceDegrees(a, b) { return 180 - Math.abs(Math.abs(a - b) - 180); } /** * Multiplies a 1x3 row vector with a 3x3 matrix. */ function matrixMultiply(row, matrix) { const a = row[0] * matrix[0][0] + row[1] * matrix[0][1] + row[2] * matrix[0][2]; const b = row[0] * matrix[1][0] + row[1] * matrix[1][1] + row[2] * matrix[1][2]; const c = row[0] * matrix[2][0] + row[1] * matrix[2][1] + row[2] * matrix[2][2]; return [ a, b, c ]; } /** * Color science utilities. * * Utility methods for color science constants and color space * conversions that aren't HCT or CAM16. */ const SRGB_TO_XYZ = [ [ .41233895, .35762064, .18051042 ], [ .2126, .7152, .0722 ], [ .01932141, .11916382, .95034478 ] ]; const XYZ_TO_SRGB = [ [ 3.2413774792388685, -1.5376652402851851, -.49885366846268053 ], [ -.9691452513005321, 1.8758853451067872, .04156585616912061 ], [ .05562093689691305, -.20395524564742123, 1.0571799111220335 ] ]; const WHITE_POINT_D65 = [ 95.047, 100, 108.883 ]; /** * Converts a color from RGB components to ARGB format. */ function argbFromRgb(red, green, blue) { return (255 << 24 | (red & 255) << 16 | (green & 255) << 8 | blue & 255) >>> 0; } /** * Converts a color from linear RGB components to ARGB format. */ function argbFromLinrgb(linrgb) { const r = delinearized(linrgb[0]); const g = delinearized(linrgb[1]); const b = delinearized(linrgb[2]); return argbFromRgb(r, g, b); } /** * Returns the alpha component of a color in ARGB format. */ function alphaFromArgb(argb) { return argb >> 24 & 255; } /** * Returns the red component of a color in ARGB format. */ function redFromArgb(argb) { return argb >> 16 & 255; } /** * Returns the green component of a color in ARGB format. */ function greenFromArgb(argb) { return argb >> 8 & 255; } /** * Returns the blue component of a color in ARGB format. */ function blueFromArgb(argb) { return argb & 255; } /** * Returns whether a color in ARGB format is opaque. */ function isOpaque(argb) { return alphaFromArgb(argb) >= 255; } /** * Converts a color from ARGB to XYZ. */ function argbFromXyz(x, y, z) { const matrix = XYZ_TO_SRGB; const linearR = matrix[0][0] * x + matrix[0][1] * y + matrix[0][2] * z; const linearG = matrix[1][0] * x + matrix[1][1] * y + matrix[1][2] * z; const linearB = matrix[2][0] * x + matrix[2][1] * y + matrix[2][2] * z; const r = delinearized(linearR); const g = delinearized(linearG); const b = delinearized(linearB); return argbFromRgb(r, g, b); } /** * Converts a color from XYZ to ARGB. */ function xyzFromArgb(argb) { const r = linearized(redFromArgb(argb)); const g = linearized(greenFromArgb(argb)); const b = linearized(blueFromArgb(argb)); return matrixMultiply([ r, g, b ], SRGB_TO_XYZ); } /** * Converts a color represented in Lab color space into an ARGB * integer. */ function argbFromLab(l, a, b) { const whitePoint = WHITE_POINT_D65; const fy = (l + 16) / 116; const fx = a / 500 + fy; const fz = fy - b / 200; const xNormalized = labInvf(fx); const yNormalized = labInvf(fy); const zNormalized = labInvf(fz); const x = xNormalized * whitePoint[0]; const y = yNormalized * whitePoint[1]; const z = zNormalized * whitePoint[2]; return argbFromXyz(x, y, z); } /** * Converts a color from ARGB representation to L*a*b* * representation. * * @param argb the ARGB representation of a color * @return a Lab object representing the color */ function labFromArgb(argb) { const linearR = linearized(redFromArgb(argb)); const linearG = linearized(greenFromArgb(argb)); const linearB = linearized(blueFromArgb(argb)); const matrix = SRGB_TO_XYZ; const x = matrix[0][0] * linearR + matrix[0][1] * linearG + matrix[0][2] * linearB; const y = matrix[1][0] * linearR + matrix[1][1] * linearG + matrix[1][2] * linearB; const z = matrix[2][0] * linearR + matrix[2][1] * linearG + matrix[2][2] * linearB; const whitePoint = WHITE_POINT_D65; const xNormalized = x / whitePoint[0]; const yNormalized = y / whitePoint[1]; const zNormalized = z / whitePoint[2]; const fx = labF(xNormalized); const fy = labF(yNormalized); const fz = labF(zNormalized); const l = 116 * fy - 16; const a = 500 * (fx - fy); const b = 200 * (fy - fz); return [ l, a, b ]; } /** * Converts an L* value to an ARGB representation. * * @param lstar L* in L*a*b* * @return ARGB representation of grayscale color with lightness * matching L* */ function argbFromLstar(lstar) { const y = yFromLstar(lstar); const component = delinearized(y); return argbFromRgb(component, component, component); } /** * Computes the L* value of a color in ARGB representation. * * @param argb ARGB representation of a color * @return L*, from L*a*b*, coordinate of the color */ function lstarFromArgb(argb) { const y = xyzFromArgb(argb)[1]; return 116 * labF(y / 100) - 16; } /** * Converts an L* value to a Y value. * * L* in L*a*b* and Y in XYZ measure the same quantity, luminance. * * L* measures perceptual luminance, a linear scale. Y in XYZ * measures relative luminance, a logarithmic scale. * * @param lstar L* in L*a*b* * @return Y in XYZ */ function yFromLstar(lstar) { return 100 * labInvf((lstar + 16) / 116); } /** * Converts a Y value to an L* value. * * L* in L*a*b* and Y in XYZ measure the same quantity, luminance. * * L* measures perceptual luminance, a linear scale. Y in XYZ * measures relative luminance, a logarithmic scale. * * @param y Y in XYZ * @return L* in L*a*b* */ function lstarFromY(y) { return labF(y / 100) * 116 - 16; } /** * Linearizes an RGB component. * * @param rgbComponent 0 <= rgb_component <= 255, represents R/G/B * channel * @return 0.0 <= output <= 100.0, color channel converted to * linear RGB space */ function linearized(rgbComponent) { const normalized = rgbComponent / 255; if (normalized <= .040449936) return normalized / 12.92 * 100; else return Math.pow((normalized + .055) / 1.055, 2.4) * 100; } /** * Delinearizes an RGB component. * * @param rgbComponent 0.0 <= rgb_component <= 100.0, represents * linear R/G/B channel * @return 0 <= output <= 255, color channel converted to regular * RGB space */ function delinearized(rgbComponent) { const normalized = rgbComponent / 100; let delinearized$1 = 0; if (normalized <= .0031308) delinearized$1 = normalized * 12.92; else delinearized$1 = 1.055 * Math.pow(normalized, 1 / 2.4) - .055; return clampInt(0, 255, Math.round(delinearized$1 * 255)); } /** * Returns the standard white point; white on a sunny day. * * @return The white point */ function whitePointD65() { return WHITE_POINT_D65; } function labF(t) { const e = 216 / 24389; const kappa = 24389 / 27; if (t > e) return Math.pow(t, 1 / 3); else return (kappa * t + 16) / 116; } function labInvf(ft) { const e = 216 / 24389; const kappa = 24389 / 27; const ft3 = ft * ft * ft; if (ft3 > e) return ft3; else return (116 * ft - 16) / kappa; } /** * In traditional color spaces, a color can be identified solely by the * observer's measurement of the color. Color appearance models such as CAM16 * also use information about the environment where the color was * observed, known as the viewing conditions. * * For example, white under the traditional assumption of a midday sun white * point is accurately measured as a slightly chromatic blue by CAM16. (roughly, * hue 203, chroma 3, lightness 100) * * This class caches intermediate values of the CAM16 conversion process that * depend only on viewing conditions, enabling speed ups. */ var ViewingConditions = class ViewingConditions$1 { /** sRGB-like viewing conditions. */ static DEFAULT = ViewingConditions$1.make(); /** * Create ViewingConditions from a simple, physically relevant, set of * parameters. * * @param whitePoint White point, measured in the XYZ color space. * default = D65, or sunny day afternoon * @param adaptingLuminance The luminance of the adapting field. Informally, * how bright it is in the room where the color is viewed. Can be * calculated from lux by multiplying lux by 0.0586. default = 11.72, * or 200 lux. * @param backgroundLstar The lightness of the area surrounding the color. * measured by L* in L*a*b*. default = 50.0 * @param surround A general description of the lighting surrounding the * color. 0 is pitch dark, like watching a movie in a theater. 1.0 is a * dimly light room, like watching TV at home at night. 2.0 means there * is no difference between the lighting on the color and around it. * default = 2.0 * @param discountingIlluminant Whether the eye accounts for the tint of the * ambient lighting, such as knowing an apple is still red in green light. * default = false, the eye does not perform this process on * self-luminous objects like displays. */ static make(whitePoint = whitePointD65(), adaptingLuminance = 200 / Math.PI * yFromLstar(50) / 100, backgroundLstar = 50, surround = 2, discountingIlluminant = false) { const xyz = whitePoint; const rW = xyz[0] * .401288 + xyz[1] * .650173 + xyz[2] * -.051461; const gW = xyz[0] * -.250268 + xyz[1] * 1.204414 + xyz[2] * .045854; const bW = xyz[0] * -.002079 + xyz[1] * .048952 + xyz[2] * .953127; const f = .8 + surround / 10; const c = f >= .9 ? lerp(.59, .69, (f - .9) * 10) : lerp(.525, .59, (f - .8) * 10); let d = discountingIlluminant ? 1 : f * (1 - 1 / 3.6 * Math.exp((-adaptingLuminance - 42) / 92)); d = d > 1 ? 1 : d < 0 ? 0 : d; const nc = f; const rgbD = [ d * (100 / rW) + 1 - d, d * (100 / gW) + 1 - d, d * (100 / bW) + 1 - d ]; const k = 1 / (5 * adaptingLuminance + 1); const k4 = k * k * k * k; const k4F = 1 - k4; const fl = k4 * adaptingLuminance + .1 * k4F * k4F * Math.cbrt(5 * adaptingLuminance); const n = yFromLstar(backgroundLstar) / whitePoint[1]; const z = 1.48 + Math.sqrt(n); const nbb = .725 / Math.pow(n, .2); const ncb = nbb; const rgbAFactors = [ Math.pow(fl * rgbD[0] * rW / 100, .42), Math.pow(fl * rgbD[1] * gW / 100, .42), Math.pow(fl * rgbD[2] * bW / 100, .42) ]; const rgbA = [ 400 * rgbAFactors[0] / (rgbAFactors[0] + 27.13), 400 * rgbAFactors[1] / (rgbAFactors[1] + 27.13), 400 * rgbAFactors[2] / (rgbAFactors[2] + 27.13) ]; const aw = (2 * rgbA[0] + rgbA[1] + .05 * rgbA[2]) * nbb; return new ViewingConditions$1(n, aw, nbb, ncb, c, nc, rgbD, fl, Math.pow(fl, .25), z); } /** * Parameters are intermediate values of the CAM16 conversion process. Their * names are shorthand for technical color science terminology, this class * would not benefit from documenting them individually. A brief overview * is available in the CAM16 specification, and a complete overview requires * a color science textbook, such as Fairchild's Color Appearance Models. */ constructor(n, aw, nbb, ncb, c, nc, rgbD, fl, fLRoot, z) { this.n = n; this.aw = aw; this.nbb = nbb; this.ncb = ncb; this.c = c; this.nc = nc; this.rgbD = rgbD; this.fl = fl; this.fLRoot = fLRoot; this.z = z; } }; /** * CAM16, a color appearance model. Colors are not just defined by their hex * code, but rather, a hex code and viewing conditions. * * CAM16 instances also have coordinates in the CAM16-UCS space, called J*, a*, * b*, or jstar, astar, bstar in code. CAM16-UCS is included in the CAM16 * specification, and should be used when measuring distances between colors. * * In traditional color spaces, a color can be identified solely by the * observer's measurement of the color. Color appearance models such as CAM16 * also use information about the environment where the color was * observed, known as the viewing conditions. * * For example, white under the traditional assumption of a midday sun white * point is accurately measured as a slightly chromatic blue by CAM16. (roughly, * hue 203, chroma 3, lightness 100) */ var Cam16 = class Cam16$1 { /** * All of the CAM16 dimensions can be calculated from 3 of the dimensions, in * the following combinations: * - {j or q} and {c, m, or s} and hue * - jstar, astar, bstar * Prefer using a static method that constructs from 3 of those dimensions. * This constructor is intended for those methods to use to return all * possible dimensions. * * @param hue * @param chroma informally, colorfulness / color intensity. like saturation * in HSL, except perceptually accurate. * @param j lightness * @param q brightness; ratio of lightness to white point's lightness * @param m colorfulness * @param s saturation; ratio of chroma to white point's chroma * @param jstar CAM16-UCS J coordinate * @param astar CAM16-UCS a coordinate * @param bstar CAM16-UCS b coordinate */ constructor(hue, chroma, j, q, m, s, jstar, astar, bstar) { this.hue = hue; this.chroma = chroma; this.j = j; this.q = q; this.m = m; this.s = s; this.jstar = jstar; this.astar = astar; this.bstar = bstar; } /** * CAM16 instances also have coordinates in the CAM16-UCS space, called J*, * a*, b*, or jstar, astar, bstar in code. CAM16-UCS is included in the CAM16 * specification, and is used to measure distances between colors. */ distance(other) { const dJ = this.jstar - other.jstar; const dA = this.astar - other.astar; const dB = this.bstar - other.bstar; const dEPrime = Math.sqrt(dJ * dJ + dA * dA + dB * dB); const dE = 1.41 * Math.pow(dEPrime, .63); return dE; } /** * @param argb ARGB representation of a color. * @return CAM16 color, assuming the color was viewed in default viewing * conditions. */ static fromInt(argb) { return Cam16$1.fromIntInViewingConditions(argb, ViewingConditions.DEFAULT); } /** * @param argb ARGB representation of a color. * @param viewingConditions Information about the environment where the color * was observed. * @return CAM16 color. */ static fromIntInViewingConditions(argb, viewingConditions) { const red = (argb & 16711680) >> 16; const green = (argb & 65280) >> 8; const blue = argb & 255; const redL = linearized(red); const greenL = linearized(green); const blueL = linearized(blue); const x = .41233895 * redL + .35762064 * greenL + .18051042 * blueL; const y = .2126 * redL + .7152 * greenL + .0722 * blueL; const z = .01932141 * redL + .11916382 * greenL + .95034478 * blueL; const rC = .401288 * x + .650173 * y - .051461 * z; const gC = -.250268 * x + 1.204414 * y + .045854 * z; const bC = -.002079 * x + .048952 * y + .953127 * z; const rD = viewingConditions.rgbD[0] * rC; const gD = viewingConditions.rgbD[1] * gC; const bD = viewingConditions.rgbD[2] * bC; const rAF = Math.pow(viewingConditions.fl * Math.abs(rD) / 100, .42); const gAF = Math.pow(viewingConditions.fl * Math.abs(gD) / 100, .42); const bAF = Math.pow(viewingConditions.fl * Math.abs(bD) / 100, .42); const rA = signum(rD) * 400 * rAF / (rAF + 27.13); const gA = signum(gD) * 400 * gAF / (gAF + 27.13); const bA = signum(bD) * 400 * bAF / (bAF + 27.13); const a = (11 * rA + -12 * gA + bA) / 11; const b = (rA + gA - 2 * bA) / 9; const u = (20 * rA + 20 * gA + 21 * bA) / 20; const p2 = (40 * rA + 20 * gA + bA) / 20; const atan2 = Math.atan2(b, a); const atanDegrees = atan2 * 180 / Math.PI; const hue = atanDegrees < 0 ? atanDegrees + 360 : atanDegrees >= 360 ? atanDegrees - 360 : atanDegrees; const hueRadians = hue * Math.PI / 180; const ac = p2 * viewingConditions.nbb; const j = 100 * Math.pow(ac / viewingConditions.aw, viewingConditions.c * viewingConditions.z); const q = 4 / viewingConditions.c * Math.sqrt(j / 100) * (viewingConditions.aw + 4) * viewingConditions.fLRoot; const huePrime = hue < 20.14 ? hue + 360 : hue; const eHue = .25 * (Math.cos(huePrime * Math.PI / 180 + 2) + 3.8); const p1 = 5e4 / 13 * eHue * viewingConditions.nc * viewingConditions.ncb; const t = p1 * Math.sqrt(a * a + b * b) / (u + .305); const alpha = Math.pow(t, .9) * Math.pow(1.64 - Math.pow(.29, viewingConditions.n), .73); const c = alpha * Math.sqrt(j / 100); const m = c * viewingConditions.fLRoot; const s = 50 * Math.sqrt(alpha * viewingConditions.c / (viewingConditions.aw + 4)); const jstar = 1.7000000000000002 * j / (1 + .007 * j); const mstar = 1 / .0228 * Math.log(1 + .0228 * m); const astar = mstar * Math.cos(hueRadians); const bstar = mstar * Math.sin(hueRadians); return new Cam16$1(hue, c, j, q, m, s, jstar, astar, bstar); } /** * @param j CAM16 lightness * @param c CAM16 chroma * @param h CAM16 hue */ static fromJch(j, c, h) { return Cam16$1.fromJchInViewingConditions(j, c, h, ViewingConditions.DEFAULT); } /** * @param j CAM16 lightness * @param c CAM16 chroma * @param h CAM16 hue * @param viewingConditions Information about the environment where the color * was observed. */ static fromJchInViewingConditions(j, c, h, viewingConditions) { const q = 4 / viewingConditions.c * Math.sqrt(j / 100) * (viewingConditions.aw + 4) * viewingConditions.fLRoot; const m = c * viewingConditions.fLRoot; const alpha = c / Math.sqrt(j / 100); const s = 50 * Math.sqrt(alpha * viewingConditions.c / (viewingConditions.aw + 4)); const hueRadians = h * Math.PI / 180; const jstar = 1.7000000000000002 * j / (1 + .007 * j); const mstar = 1 / .0228 * Math.log(1 + .0228 * m); const astar = mstar * Math.cos(hueRadians); const bstar = mstar * Math.sin(hueRadians); return new Cam16$1(h, c, j, q, m, s, jstar, astar, bstar); } /** * @param jstar CAM16-UCS lightness. * @param astar CAM16-UCS a dimension. Like a* in L*a*b*, it is a Cartesian * coordinate on the Y axis. * @param bstar CAM16-UCS b dimension. Like a* in L*a*b*, it is a Cartesian * coordinate on the X axis. */ static fromUcs(jstar, astar, bstar) { return Cam16$1.fromUcsInViewingConditions(jstar, astar, bstar, ViewingConditions.DEFAULT); } /** * @param jstar CAM16-UCS lightness. * @param astar CAM16-UCS a dimension. Like a* in L*a*b*, it is a Cartesian * coordinate on the Y axis. * @param bstar CAM16-UCS b dimension. Like a* in L*a*b*, it is a Cartesian * coordinate on the X axis. * @param viewingConditions Information about the environment where the color * was observed. */ static fromUcsInViewingConditions(jstar, astar, bstar, viewingConditions) { const a = astar; const b = bstar; const m = Math.sqrt(a * a + b * b); const M = (Math.exp(m * .0228) - 1) / .0228; const c = M / viewingConditions.fLRoot; let h = Math.atan2(b, a) * (180 / Math.PI); if (h < 0) h += 360; const j = jstar / (1 - (jstar - 100) * .007); return Cam16$1.fromJchInViewingConditions(j, c, h, viewingConditions); } /** * @return ARGB representation of color, assuming the color was viewed in * default viewing conditions, which are near-identical to the default * viewing conditions for sRGB. */ toInt() { return this.viewed(ViewingConditions.DEFAULT); } /** * @param viewingConditions Information about the environment where the color * will be viewed. * @return ARGB representation of color */ viewed(viewingConditions) { const alpha = this.chroma === 0 || this.j === 0 ? 0 : this.chroma / Math.sqrt(this.j / 100); const t = Math.pow(alpha / Math.pow(1.64 - Math.pow(.29, viewingConditions.n), .73), 1 / .9); const hRad = this.hue * Math.PI / 180; const eHue = .25 * (Math.cos(hRad + 2) + 3.8); const ac = viewingConditions.aw * Math.pow(this.j / 100, 1 / viewingConditions.c / viewingConditions.z); const p1 = eHue * (5e4 / 13) * viewingConditions.nc * viewingConditions.ncb; const p2 = ac / viewingConditions.nbb; const hSin = Math.sin(hRad); const hCos = Math.cos(hRad); const gamma = 23 * (p2 + .305) * t / (23 * p1 + 11 * t * hCos + 108 * t * hSin); const a = gamma * hCos; const b = gamma * hSin; const rA = (460 * p2 + 451 * a + 288 * b) / 1403; const gA = (460 * p2 - 891 * a - 261 * b) / 1403; const bA = (460 * p2 - 220 * a - 6300 * b) / 1403; const rCBase = Math.max(0, 27.13 * Math.abs(rA) / (400 - Math.abs(rA))); const rC = signum(rA) * (100 / viewingConditions.fl) * Math.pow(rCBase, 1 / .42); const gCBase = Math.max(0, 27.13 * Math.abs(gA) / (400 - Math.abs(gA))); const gC = signum(gA) * (100 / viewingConditions.fl) * Math.pow(gCBase, 1 / .42); const bCBase = Math.max(0, 27.13 * Math.abs(bA) / (400 - Math.abs(bA))); const bC = signum(bA) * (100 / viewingConditions.fl) * Math.pow(bCBase, 1 / .42); const rF = rC / viewingConditions.rgbD[0]; const gF = gC / viewingConditions.rgbD[1]; const bF = bC / viewingConditions.rgbD[2]; const x = 1.86206786 * rF - 1.01125463 * gF + .14918677 * bF; const y = .38752654 * rF + .62144744 * gF - .00897398 * bF; const z = -.0158415 * rF - .03412294 * gF + 1.04996444 * bF; const argb = argbFromXyz(x, y, z); return argb; } static fromXyzInViewingConditions(x, y, z, viewingConditions) { const rC = .401288 * x + .650173 * y - .051461 * z; const gC = -.250268 * x + 1.204414 * y + .045854 * z; const bC = -.002079 * x + .048952 * y + .953127 * z; const rD = viewingConditions.rgbD[0] * rC; const gD = viewingConditions.rgbD[1] * gC; const bD = viewingConditions.rgbD[2] * bC; const rAF = Math.pow(viewingConditions.fl * Math.abs(rD) / 100, .42); const gAF = Math.pow(viewingConditions.fl * Math.abs(gD) / 100, .42); const bAF = Math.pow(viewingConditions.fl * Math.abs(bD) / 100, .42); const rA = signum(rD) * 400 * rAF / (rAF + 27.13); const gA = signum(gD) * 400 * gAF / (gAF + 27.13); const bA = signum(bD) * 400 * bAF / (bAF + 27.13); const a = (11 * rA + -12 * gA + bA) / 11; const b = (rA + gA - 2 * bA) / 9; const u = (20 * rA + 20 * gA + 21 * bA) / 20; const p2 = (40 * rA + 20 * gA + bA) / 20; const atan2 = Math.atan2(b, a); const atanDegrees = atan2 * 180 / Math.PI; const hue = atanDegrees < 0 ? atanDegrees + 360 : atanDegrees >= 360 ? atanDegrees - 360 : atanDegrees; const hueRadians = hue * Math.PI / 180; const ac = p2 * viewingConditions.nbb; const J = 100 * Math.pow(ac / viewingConditions.aw, viewingConditions.c * viewingConditions.z); const Q = 4 / viewingConditions.c * Math.sqrt(J / 100) * (viewingConditions.aw + 4) * viewingConditions.fLRoot; const huePrime = hue < 20.14 ? hue + 360 : hue; const eHue = 1 / 4 * (Math.cos(huePrime * Math.PI / 180 + 2) + 3.8); const p1 = 5e4 / 13 * eHue * viewingConditions.nc * viewingConditions.ncb; const t = p1 * Math.sqrt(a * a + b * b) / (u + .305); const alpha = Math.pow(t, .9) * Math.pow(1.64 - Math.pow(.29, viewingConditions.n), .73); const C = alpha * Math.sqrt(J / 100); const M = C * viewingConditions.fLRoot; const s = 50 * Math.sqrt(alpha * viewingConditions.c / (viewingConditions.aw + 4)); const jstar = 1.7000000000000002 * J / (1 + .007 * J); const mstar = Math.log(1 + .0228 * M) / .0228; const astar = mstar * Math.cos(hueRadians); const bstar = mstar * Math.sin(hueRadians); return new Cam16$1(hue, C, J, Q, M, s, jstar, astar, bstar); } xyzInViewingConditions(viewingConditions) { const alpha = this.chroma === 0 || this.j === 0 ? 0 : this.chroma / Math.sqrt(this.j / 100); const t = Math.pow(alpha / Math.pow(1.64 - Math.pow(.29, viewingConditions.n), .73), 1 / .9); const hRad = this.hue * Math.PI / 180; const eHue = .25 * (Math.cos(hRad + 2) + 3.8); const ac = viewingConditions.aw * Math.pow(this.j / 100, 1 / viewingConditions.c / viewingConditions.z); const p1 = eHue * (5e4 / 13) * viewingConditions.nc * viewingConditions.ncb; const p2 = ac / viewingConditions.nbb; const hSin = Math.sin(hRad); const hCos = Math.cos(hRad); const gamma = 23 * (p2 + .305) * t / (23 * p1 + 11 * t * hCos + 108 * t * hSin); const a = gamma * hCos; const b = gamma * hSin; const rA = (460 * p2 + 451 * a + 288 * b) / 1403; const gA = (460 * p2 - 891 * a - 261 * b) / 1403; const bA = (460 * p2 - 220 * a - 6300 * b) / 1403; const rCBase = Math.max(0, 27.13 * Math.abs(rA) / (400 - Math.abs(rA))); const rC = signum(rA) * (100 / viewingConditions.fl) * Math.pow(rCBase, 1 / .42); const gCBase = Math.max(0, 27.13 * Math.abs(gA) / (400 - Math.abs(gA))); const gC = signum(gA) * (100 / viewingConditions.fl) * Math.pow(gCBase, 1 / .42); const bCBase = Math.max(0, 27.13 * Math.abs(bA) / (400 - Math.abs(bA))); const bC = signum(bA) * (100 / viewingConditions.fl) * Math.pow(bCBase, 1 / .42); const rF = rC / viewingConditions.rgbD[0]; const gF = gC / viewingConditions.rgbD[1]; const bF = bC / viewingConditions.rgbD[2]; const x = 1.86206786 * rF - 1.01125463 * gF + .14918677 * bF; const y = .38752654 * rF + .62144744 * gF - .00897398 * bF; const z = -.0158415 * rF - .03412294 * gF + 1.04996444 * bF; return [ x, y, z ]; } }; /** * A class that solves the HCT equation. */ var HctSolver = class HctSolver$1 { static SCALED_DISCOUNT_FROM_LINRGB = [ [ .001200833568784504, .002389694492170889, .0002795742885861124 ], [ .0005891086651375999, .0029785502573438758, .0003270666104008398 ], [ .00010146692491640572, .0005364214359186694, .0032979401770712076 ] ]; static LINRGB_FROM_SCALED_DISCOUNT = [ [ 1373.2198709594231, -1100.4251190754821, -7.278681089101213 ], [ -271.815969077903, 559.6580465940733, -32.46047482791194 ], [ 1.9622899599665666, -57.173814538844006, 308.7233197812385 ] ]; static Y_FROM_LINRGB = [ .2126, .7152, .0722 ]; static CRITICAL_PLANES = [ .015176349177441876, .045529047532325624, .07588174588720938, .10623444424209313, .13658714259697685, .16693984095186062, .19729253930674434, .2276452376616281, .2579979360165119, .28835063437139563, .3188300904430532, .350925934958123, .3848314933096426, .42057480301049466, .458183274052838, .4976837250274023, .5391024159806381, .5824650784040898, .6277969426914107, .6751227633498623, .7244668422128921, .775853049866786, .829304845476233, .8848452951698498, .942497089126609, 1.0022825574869039, 1.0642236851973577, 1.1283421258858297, 1.1946592148522128, 1.2631959812511864, 1.3339731595349034, 1.407011200216447, 1.4823302800086415, 1.5599503113873272, 1.6398909516233677, 1.7221716113234105, 1.8068114625156377, 1.8938294463134073, 1.9832442801866852, 2.075074464868551, 2.1693382909216234, 2.2660538449872063, 2.36523901573795, 2.4669114995532007, 2.5710888059345764, 2.6777882626779785, 2.7870270208169257, 2.898822059350997, 3.0131901897720907, 3.1301480604002863, 3.2497121605402226, 3.3718988244681087, 3.4967242352587946, 3.624204428461639, 3.754355295633311, 3.887192587735158, 4.022731918402185, 4.160988767090289, 4.301978482107941, 4.445716283538092, 4.592217266055746, 4.741496401646282, 4.893568542229298, 5.048448422192488, 5.20615066083972, 5.3666897647573375, 5.5300801301023865, 5.696336044816294, 5.865471690767354, 6.037501145825082, 6.212438385869475, 6.390297286737924, 6.571091626112461, 6.7548350853498045, 6.941541251256611, 7.131223617812143, 7.323895587840543, 7.5195704746346665, 7.7182615035334345, 7.919981813454504, 8.124744458384042, 8.332562408825165, 8.543448553206703, 8.757415699253682, 8.974476575321063, 9.194643831691977, 9.417930041841839, 9.644347703669503, 9.873909240696694, 10.106627003236781, 10.342513269534024, 10.58158024687427, 10.8238400726681, 11.069304815507364, 11.317986476196008, 11.569896988756009, 11.825048221409341, 12.083451977536606, 12.345119996613247, 12.610063955123938, 12.878295467455942, 13.149826086772048, 13.42466730586372, 13.702830557985108, 13.984327217668513, 14.269168601521828, 14.55736596900856, 14.848930523210871, 15.143873411576273, 15.44220572664832, 15.743938506781891, 16.04908273684337, 16.35764934889634, 16.66964922287304, 16.985093187232053, 17.30399201960269, 17.62635644741625, 17.95219714852476, 18.281524751807332, 18.614349837764564, 18.95068293910138, 19.290534541298456, 19.633915083172692, 19.98083495742689, 20.331304511189067, 20.685334046541502, 21.042933821039977, 21.404114048223256, 21.76888489811322, 22.137256497705877, 22.50923893145328, 22.884842241736916, 23.264076429332462, 23.6469514538663, 24.033477234264016, 24.42366364919083, 24.817520537484558, 25.21505769858089, 25.61628489293138, 26.021211842414342, 26.429848230738664, 26.842203703840827, 27.258287870275353, 27.678110301598522, 28.10168053274597, 28.529008062403893, 28.96010235337422, 29.39497283293396, 29.83362889318845, 30.276079891419332, 30.722335150426627, 31.172403958865512, 31.62629557157785, 32.08401920991837, 32.54558406207592, 33.010999283389665, 33.4802739966603, 33.953417292456834, 34.430438229418264, 34.911345834551085, 35.39614910352207, 35.88485700094671, 36.37747846067349, 36.87402238606382, 37.37449765026789, 37.87891309649659, 38.38727753828926, 38.89959975977785, 39.41588851594697, 39.93615253289054, 40.460400508064545, 40.98864111053629, 41.520882981230194, 42.05713473317016, 42.597404951718396, 43.141702194811224, 43.6900349931913, 44.24241185063697, 44.798841244188324, 45.35933162437017, 45.92389141541209, 46.49252901546552, 47.065252796817916, 47.64207110610409, 48.22299226451468, 48.808024568002054, 49.3971762874833, 49.9904556690408, 50.587870934119984, 51.189430279724725, 51.79514187861014, 52.40501387947288, 53.0190544071392, 53.637271562750364, 54.259673423945976, 54.88626804504493, 55.517063457223934, 56.15206766869424, 56.79128866487574, 57.43473440856916, 58.08241284012621, 58.734331877617365, 59.39049941699807, 60.05092333227251, 60.715611475655585, 61.38457167773311, 62.057811747619894, 62.7353394731159, 63.417162620860914, 64.10328893648692, 64.79372614476921, 65.48848194977529, 66.18756403501224, 66.89098006357258, 67.59873767827808, 68.31084450182222, 69.02730813691093, 69.74813616640164, 70.47333615344107, 71.20291564160104, 71.93688215501312, 72.67524319850172, 73.41800625771542, 74.16517879925733, 74.9167682708136, 75.67278210128072, 76.43322770089146, 77.1981124613393, 77.96744375590167, 78.74122893956174, 79.51947534912904, 80.30219030335869, 81.08938110306934, 81.88105503125999, 82.67721935322541, 83.4778813166706, 84.28304815182372, 85.09272707154808, 85.90692527145302, 86.72564993000343, 87.54890820862819, 88.3767072518277, 89.2090541872801, 90.04595612594655, 90.88742016217518, 91.73345337380438, 92.58406282226491, 93.43925555268066, 94.29903859396902, 95.16341895893969, 96.03240364439274, 96.9059996312159, 97.78421388448044, 98.6670533535366, 99.55452497210776 ]; /** * Sanitizes a small enough angle in radians. * * @param angle An angle in radians; must not deviate too much * from 0. * @return A coterminal angle between 0 and 2pi. */ static sanitizeRadians(angle) { return (angle + Math.PI * 8) % (Math.PI * 2); } /** * Delinearizes an RGB component, returning a floating-point * number. * * @param rgbComponent 0.0 <= rgb_component <= 100.0, represents * linear R/G/B channel * @return 0.0 <= output <= 255.0, color channel converted to * regular RGB space */ static trueDelinearized(rgbComponent) { const normalized = rgbComponent / 100; let delinearized$1 = 0; if (normalized <= .0031308) delinearized$1 = normalized * 12.92; else delinearized$1 = 1.055 * Math.pow(normalized, 1 / 2.4) - .055; return delinearized$1 * 255; } static chromaticAdaptation(component) { const af = Math.pow(Math.abs(component), .42); return signum(component) * 400 * af / (af + 27.13); } /** * Returns the hue of a linear RGB color in CAM16. * * @param linrgb The linear RGB coordinates of a color. * @return The hue of the color in CAM16, in radians. */ static hueOf(linrgb) { const scaledDiscount = matrixMultiply(linrgb, HctSolver$1.SCALED_DISCOUNT_FROM_LINRGB); const rA = HctSolver$1.chromaticAdaptation(scaledDiscount[0]); const gA = HctSolver$1.chromaticAdaptation(scaledDiscount[1]); const bA = HctSolver$1.chromaticAdaptation(scaledDiscount[2]); const a = (11 * rA + -12 * gA + bA) / 11; const b = (rA + gA - 2 * bA) / 9; return Math.atan2(b, a); } static areInCyclicOrder(a, b, c) { const deltaAB = HctSolver$1.sanitizeRadians(b - a); const deltaAC = HctSolver$1.sanitizeRadians(c - a); return deltaAB < deltaAC; } /** * Solves the lerp equation. * * @param source The starting number. * @param mid The number in the middle. * @param target The ending number. * @return A number t such that lerp(source, target, t) = mid. */ static intercept(source, mid, target) { return (mid - source) / (target - source); } static lerpPoint(source, t, target) { return [ source[0] + (target[0] - source[0]) * t, source[1] + (target[1] - source[1]) * t, source[2] + (target[2] - source[2]) * t ]; } /** * Intersects a segment with a plane. * * @param source The coordinates of point A. * @param coordinate The R-, G-, or B-coordinate of the plane. * @param target The coordinates of point B. * @param axis The axis the plane is perpendicular with. (0: R, 1: * G, 2: B) * @return The intersection point of the segment AB with the plane * R=coordinate, G=coordinate, or B=coordinate */ static setCoordinate(source, coordinate, target, axis) { const t = HctSolver$1.intercept(source[axis], coordinate, target[axis]); return HctSolver$1.lerpPoint(source, t, target); } static isBounded(x) { return 0 <= x && x <= 100; } /** * Returns the nth possible vertex of the polygonal intersection. * * @param y The Y value of the plane. * @param n The zero-based index of the point. 0 <= n <= 11. * @return The nth possible vertex of the polygonal intersection * of the y plane and the RGB cube, in linear RGB coordinates, if * it exists. If this possible vertex lies outside of the cube, * [-1.0, -1.0, -1.0] is returned. */ static nthVertex(y, n) { const kR = HctSolver$1.Y_FROM_LINRGB[0]; const kG = HctSolver$1.Y_FROM_LINRGB[1]; const kB = HctSolver$1.Y_FROM_LINRGB[2]; const coordA = n % 4 <= 1 ? 0 : 100; const coordB = n % 2 === 0 ? 0 : 100; if (n < 4) { const g = coordA; const b = coordB; const r = (y - g * kG - b * kB) / kR; if (HctSolver$1.isBounded(r)) return [ r, g, b ]; else return [ -1, -1, -1 ]; } else if (n < 8) { const b = coordA; const r = coordB; const g = (y - r * kR - b * kB) / kG; if (HctSolver$1.isBounded(g)) return [ r, g, b ]; else return [ -1, -1, -1 ]; } else { const r = coordA; const g = coordB; const b = (y - r * kR - g * kG) / kB; if (HctSolver$1.isBounded(b)) return [ r, g, b ]; else return [ -1, -1, -1 ]; } } /** * Finds the segment containing the desired color. * * @param y The Y value of the color. * @param targetHue The hue of the color. * @return A list of two sets of linear RGB coordinates, each * corresponding to an endpoint of the segment containing the * desired color. */ static bisectToSegment(y, targetHue) { let left = [ -1, -1, -1 ]; let right = left; let leftHue = 0; let rightHue = 0; let initialized = false; let uncut = true; for (let n = 0; n < 12; n++) { const mid = HctSolver$1.nthVertex(y, n); if (mid[0] < 0) continue; const midHue = HctSolver$1.hueOf(mid); if (!initialized) { left = mid; right = mid; leftHue = midHue; rightHue = midHue; initialized = true; continue; } if (uncut || HctSolver$1.areInCyclicOrder(leftHue, midHue, rightHue)) { uncut = false; if (HctSolver$1.areInCyclicOrder(leftHue, targetHue, midHue)) { right = mid; rightHue = midHue; } else { left = mid; leftHue = midHue; } } } return [left, right]; } static midpoint(a, b) { return [ (a[0] + b[0]) / 2, (a[1] + b[1]) / 2, (a[2] + b[2]) / 2 ]; } static criticalPlaneBelow(x) { return Math.floor(x - .5); } static criticalPlaneAbove(x) { return Math.ceil(x - .5); } /** * Finds a color with the given Y and hue on the boundary of the * cube. * * @param y The Y value of the color. * @param targetHue The hue of the color. * @return The desired color, in linear RGB coordinates. */ static bisectToLimit(y, targetHue) { const segment = HctSolver$1.bisectToSegment(y, targetHue); let left = segment[0]; let leftHue = HctSolver$1.hueOf(left); let right = segment[1]; for (let axis = 0; axis < 3; axis++) if (left[axis] !== right[axis]) { let lPlane = -1; let rPlane = 255; if (left[axis] < right[axis]) { lPlane = HctSolver$1.criticalPlaneBelow(HctSolver$1.trueDelinearized(left[axis])); rPlane = HctSolver$1.criticalPlaneAbove(HctSolver$1.trueDelinearized(right[axis])); } else { lPlane = HctSolver$1.criticalPlaneAbove(HctSolver$1.trueDelinearized(left[axis])); rPlane = HctSolver$1.criticalPlaneBelow(HctSolver$1.trueDelinearized(right[axis])); } for (let i = 0; i < 8; i++) if (Math.abs(rPlane - lPlane) <= 1) break; else { const mPlane = Math.floor((lPlane + rPlane) / 2); const midPlaneCoordinate = HctSolver$1.CRITICAL_PLANES[mPlane]; const mid = HctSolver$1.setCoordinate(left, midPlaneCoordinate, right, axis); const midHue = HctSolver$1.hueOf(mid); if (HctSolver$1.areInCyclicOrder(leftHue, targetHue, midHue)) { right = mid; rPlane = mPlane; } else { left = mid; leftHue = midHue; lPlane = mPlane; } } } return HctSolver$1.midpoint(left, right); } static inverseChromaticAdaptation(adapted) { const adaptedAbs = Math.abs(adapted); const base = Math.max(0, 27.13 * adaptedAbs / (400 - adaptedAbs)); return signum(adapted) * Math.pow(base, 1 / .42); } /** * Finds a color with the given hue, chroma, and Y. * * @param hueRadians The desired hue in radians. * @param chroma The desired chroma. * @param y The desired Y. * @return The desired color as a hexadecimal integer, if found; 0 * otherwise. */ static findResultByJ(hueRadians, chroma, y) { let j = Math.sqrt(y) * 11; const viewingConditions = ViewingConditions.DEFAULT; const tInnerCoeff = 1 / Math.pow(1.64 - Math.pow(.29, viewingConditions.n), .73); const eHue = .25 * (Math.cos(hueRadians + 2) + 3.8); const p1 = eHue * (5e4 / 13) * viewingConditions.nc * viewingConditions.ncb; const hSin = Math.sin(hueRadians); const hCos = Math.cos(hueRadians); for (let iterationRound = 0; iterationRound < 5; iterationRound++) { const jNormalized = j / 100; const alpha = chroma === 0 || j === 0 ? 0 : chroma / Math.sqrt(jNormalized); const t = Math.pow(alpha * tInnerCoeff, 1 / .9); const ac = viewingConditions.aw * Math.pow(jNormalized, 1 / viewingConditions.c / viewingConditions.z); const p2 = ac / viewingConditions.nbb; const gamma = 23 * (p2 + .305) * t / (23 * p1 + 11 * t * hCos + 108 * t * hSin); const a = gamma * hCos; const b = gamma * hSin; const rA = (460 * p2 + 451 * a + 288 * b) / 1403; const gA = (460 * p2 - 891 * a - 261 * b) / 1403; const bA = (460 * p2 - 220 * a - 6300 * b) / 1403; const rCScaled = HctSolver$1.inverseChromaticAdaptation(rA); const gCScaled = HctSolver$1.inverseChromaticAdaptation(gA); const bCScaled = HctSolver$1.inverseChromaticAdaptation(bA); const linrgb = matrixMultiply([ rCScaled, gCScaled, bCScaled ], HctSolver$1.LINRGB_FROM_SCALED_DISCOUNT); if (linrgb[0] < 0 || linrgb[1] < 0 || linrgb[2] < 0) return 0; const kR = HctSolver$1.Y_FROM_LINRGB[0]; const kG = HctSolver$1.Y_FROM_LINRGB[1]; const kB = HctSolver$1.Y_FROM_LINRGB[2]; const fnj = kR * linrgb[0] + kG * linrgb[1] + kB * linrgb[2]; if (fnj <= 0) return 0; if (iterationRound === 4 || Math.abs(fnj - y) < .002) { if (linrgb[0] > 100.01 || linrgb[1] > 100.01 || linrgb[2] > 100.01) return 0; return argbFromLinrgb(linrgb); } j = j - (fnj - y) * j / (2 * fnj); } return 0; } /** * Finds an sRGB color with the given hue, chroma, and L*, if * possible. * * @param hueDegrees The desired hue, in degrees. * @param chroma The desired chroma. * @param lstar The desired L*. * @return A hexadecimal representing the sRGB color. The color * has sufficiently close hue, chroma, and L* to the desired * values, if possible; otherwise, the hue and L* will be * sufficiently close, and chroma will be maximized. */ static solveToInt(hueDegrees, chroma, lstar) { if (chroma < 1e-4 || lstar < 1e-4 || lstar > 99.9999) return argbFromLstar(lstar); hueDegrees = sanitizeDegreesDouble(hueDegrees); const hueRadians = hueDegrees / 180 * Math.PI; const y = yFromLstar(lstar); const exactAnswer = HctSolver$1.findResultByJ(hueRadians, chroma, y); if (exactAnswer !== 0) return exactAnswer; const linrgb = HctSolver$1.bisectToLimit(y, hueRadians); return argbFromLinrgb(linrgb); } /** * Finds an sRGB color with the given hue, chroma, and L*, if * possible. * * @param hueDegrees The desired hue, in degrees. * @param chroma The desired chroma. * @param lstar The desired L*. * @return An CAM16 object representing the sRGB color. The color * has sufficiently close hue, chroma, and L* to the desired * values, if possible; otherwise, the hue and L* will be * sufficiently close, and chroma will be maximized. */ static solveToCam(hueDegrees, chroma, lstar) { return Cam16.fromInt(HctSolver$1.solveToInt(hueDegrees, chroma, lstar)); } }; /** * HCT, hue, chroma, and tone. A color system that provides a perceptually * accurate color measurement system that can also accurately render what colors * will appear as in different lighting environments. */ var Hct = class Hct$1 { /** * @param hue 0 <= hue < 360; invalid values are corrected. * @param chroma 0 <= chroma < ?; Informally, colorfulness. The color * returned may be lower than the requested chroma. Chroma has a different * maximum for any given hue and tone. * @param tone 0 <= tone <= 100; invalid values are corrected. * @return HCT representation of a color in default viewing conditions. */ internalHue; internalChroma; internalTone; static from(hue, chroma, tone) { return new Hct$1(HctSolver.solveToInt(hue, chroma, tone)); } /** * @param argb ARGB representation of a color. * @return HCT representation of a color in default viewing conditions */ static fromInt(argb) { return new Hct$1(argb); } toInt() { return this.argb; } /** * A number, in degrees, representing ex. red, orange, yellow, etc. * Ranges from 0 <= hue < 360. */ get hue() { return this.internalHue; } /** * @param newHue 0 <= newHue < 360; invalid values are corrected. * Chroma may decrease because chroma has a different maximum for any given * hue and tone. */ set hue(newHue) { this.setInternalState(HctSolver.solveToInt(newHue, this.internalChroma, this.internalTone)); } get chroma() { return this.internalChroma; } /** * @param newChroma 0 <= newChroma < ? * Chroma may decrease because chroma has a different maximum for any given * hue and tone. */ set chroma(newChroma) { this.setInternalState(HctSolver.solveToInt(this.internalHue, newChroma, this.internalTone)); } /** Lightness. Ranges from 0 to 100. */ get tone() { return this.internalTone; } /** * @param newTone 0 <= newTone <= 100; invalid valids are corrected. * Chroma may decrease because chroma has a different maximum for any given * hue and tone. */ set tone(newTone) { this.setInternalState(HctSolver.solveToInt(this.internalHue, this.internalChroma, newTone)); } /** Sets a property of the Hct object. */ setValue(propertyName, value) { this[propertyName] = value; } toString() { return `HCT(${this.hue.toFixed(0)}, ${this.chroma.toFixed(0)}, ${this.tone.toFixed(0)})`; } static isBlue(hue) { return hue >= 250 && hue < 270; } static isYellow(hue) { return hue >= 105 && hue < 125; } static isCyan(hue) { return hue >= 170 && hue < 207; } constructor(argb) { this.argb = argb; const cam = Cam16.fromInt(argb); this.internalHue = cam.hue; this.internalChroma = cam.chroma; this.internalTone = lstarFromArgb(argb); this.argb = argb; } setInternalState(argb) { const cam = Cam16.fromInt(argb); this.internalHue = cam.hue; this.internalChroma = cam.chroma; this.internalTone = lstarFromArgb(argb); this.argb = argb; } /** * Translates a color into different [ViewingConditions]. * * Colors change appearance. They look different with lights on versus off, * the same color, as in hex code, on white looks different when on black. * This is called color relativity, most famously explicated by Josef Albers * in Interaction of Color. * * In color science, color appearance models can account for this and * calculate the appearance of a color in different settings. HCT is based on * CAM16, a color appearance model, and uses it to make these calculations. * * See [ViewingConditions.make] for parameters affecting color appearance. */ inViewingConditions(vc) { const cam = Cam16.fromInt(this.toInt()); const viewedInVc = cam.xyzInViewingConditions(vc); const recastInVc = Cam16.fromXyzInViewingConditions(viewedInVc[0], viewedInVc[1], viewedInVc[2], ViewingConditions.make()); const recastHct = Hct$1.from(recastInVc.hue, recastInVc.chroma, lstarFromY(viewedInVc[1])); return recastHct; } }; /** * Functions for blending in HCT and CAM16. */ var Blend = class Blend$1 { /** * Blend the design color's HCT hue towards the key color's HCT * hue, in a way that leaves the original color recognizable and * recognizably shifted towards the key color. * * @param designColor ARGB representation of an arbitrary color. * @param sourceColor ARGB representation of the main theme color. * @return The design color with a hue shifted towards the * system's color, a slightly warmer/cooler variant of the design * color's hue. */ static harmonize(designColor, sourceColor) { const fromHct = Hct.fromInt(designColor); const toHct = Hct.fromInt(sourceColor); const differenceDegrees$1 = differenceDegrees(fromHct.hue, toHct.hue); const rotationDegrees = Math.min(differenceDegrees$1 * .5, 15); const outputHue = sanitizeDegreesDouble(fromHct.hue + rotationDegrees * rotationDirection(fromHct.hue, toHct.hue)); return Hct.from(outputHue, fromHct.chroma, fromHct.tone).toInt(); } /** * Blends hue from one color into another. The chroma and tone of * the original color are maintained. * * @param from ARGB representation of color * @param to ARGB representation of color * @param amount how much blending to perform; 0.0 >= and <= 1.0 * @return from, with a hue blended towards to. Chroma and tone * are constant. */ static hctHue(from, to, amount) { const ucs = Blend$1.cam16Ucs(from, to, amount); const ucsCam = Cam16.fromInt(ucs); const fromCam = Cam16.fromInt(from); const blended = Hct.