@soybeanjs/colord 0.0.1

package/dist/plugins/lab.js

@@ -0,0 +1,26 @@
+import { c as round, t as clamp } from "../utils-BgIyY6bK.js";
+import "../rgb-CfVJB1Bj.js";
+import "../xyz-MII3ndWO.js";
+import { a as rgbToLab, i as parseLabString, o as roundLab, r as parseLab } from "../lab-CJHLdqfe.js";
+import { r as getDeltaE2000 } from "../get-BFaklfVd.js";
+
+//#region src/plugins/lab.ts
+/**
+* A plugin adding support for CIELAB color space.
+* https://en.wikipedia.org/wiki/CIELAB_color_space
+*/
+const labPlugin = (ColordClass, parsers) => {
+	ColordClass.prototype.toLab = function toLab() {
+		return roundLab(rgbToLab(this.rgb));
+	};
+	ColordClass.prototype.delta = function delta(color = "#FFF") {
+		const compared = color instanceof ColordClass ? color : new ColordClass(color);
+		return clamp(round(getDeltaE2000(this.toLab(), compared.toLab()) / 100, 3));
+	};
+	parsers.object.push([parseLab, "lab"]);
+	parsers.string.push([parseLabString, "lab"]);
+};
+var lab_default = labPlugin;
+
+//#endregion
+export { lab_default as default, labPlugin };

package/dist/plugins/lch.d.ts

@@ -0,0 +1,27 @@
+import { d as LchColor } from "../colord-xpgrVWRV.js";
+import { t as Plugin } from "../extend-DrPfn2Q1.js";
+
+//#region src/plugins/lch.d.ts
+declare module '../colord' {
+  interface Colord {
+    /**
+     * Converts a color to CIELCH (Lightness-Chroma-Hue) color space and returns an object.
+     * https://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/
+     * https://en.wikipedia.org/wiki/CIELAB_color_space#Cylindrical_model
+     */
+    toLch(): LchColor;
+    /**
+     * Converts a color to CIELCH (Lightness-Chroma-Hue) color space and returns a string.
+     * https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/lch()
+     */
+    toLchString(): string;
+  }
+}
+/**
+ * A plugin adding support for CIELCH color space.
+ * https://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/
+ * https://en.wikipedia.org/wiki/CIELAB_color_space#Cylindrical_model
+ */
+declare const lchPlugin: Plugin;
+//#endregion
+export { lchPlugin as default, lchPlugin };

package/dist/plugins/lch.js

@@ -0,0 +1,122 @@
+import { _ as ALPHA_PRECISION, c as round, i as isPresent, n as clampHue, o as parseAlpha, s as parseHue, t as clamp } from "../utils-BgIyY6bK.js";
+import "../rgb-CfVJB1Bj.js";
+import "../xyz-MII3ndWO.js";
+import { a as rgbToLab, n as labToRgb } from "../lab-CJHLdqfe.js";
+
+//#region src/models/lch.ts
+/**
+* Limits LCH axis values.
+* https://www.w3.org/TR/css-color-4/#specifying-lab-lch
+* https://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/#how-does-lch-work
+*/
+const clampLch = (lab) => {
+	const { l, c, h, alpha } = lab;
+	return {
+		l: clamp(l, 0, 100),
+		c: clamp(c),
+		h: clampHue(h),
+		alpha: clamp(alpha)
+	};
+};
+const roundLch = (lab) => {
+	const { l, c, h, alpha } = lab;
+	return {
+		l: round(l, 3),
+		c: round(c, 3),
+		h: round(h, 3),
+		alpha: round(alpha, ALPHA_PRECISION)
+	};
+};
+/**
+* Performs RGB → CIEXYZ → CIELAB → CIELCH color conversion
+* https://www.w3.org/TR/css-color-4/#color-conversion-code
+*/
+const rgbToLch = (rgb) => {
+	const { l, a, b, alpha } = rgbToLab(rgb);
+	const c = Math.sqrt(a * a + b * b);
+	let h;
+	if (c < 1e-4) h = 0;
+	else {
+		h = Math.atan2(b, a) * 180 / Math.PI;
+		if (h < 0) h += 360;
+	}
+	return {
+		l,
+		c,
+		h,
+		alpha
+	};
+};
+/**
+* Performs CIELCH → CIELAB → CIEXYZ → RGB color conversion
+* https://www.w3.org/TR/css-color-4/#color-conversion-code
+*/
+const lchaToRgb = (lcha) => {
+	const { l, c, h, alpha } = lcha;
+	const hRad = h * Math.PI / 180;
+	return labToRgb({
+		l,
+		a: c * Math.cos(hRad),
+		b: c * Math.sin(hRad),
+		alpha
+	});
+};
+const parseLch = ({ l, c, h, alpha = 1 }) => {
+	if (!isPresent(l) || !isPresent(c) || !isPresent(h)) return null;
+	return lchaToRgb(clampLch({
+		l: Number(l),
+		c: Number(c),
+		h: Number(h),
+		alpha: Number(alpha)
+	}));
+};
+/**
+* Parsing syntax: lch(L c h [/ alpha])
+* - L: <number|percentage> [0,100]
+* - c: <number> [0,150]
+* - h: <number|angle> [0,360] (deg, rad, grad, turn)
+* - alpha: <number|percentage> [0,1]
+*
+*/
+const lchaMatcher = /^lch\(\s*([+-]?[\d.]+)%?\s+([+-]?[\d.]+)\s+([+-]?[\d.]+)(deg|grad|rad|turn)?(?:\s*\/\s*([+-]?[\d.]+%?))?\s*\)$/i;
+/**
+* Parses a valid LCH CSS color function/string
+* https://www.w3.org/TR/css-color-4/#specifying-lab-lch
+*/
+const parseLchString = (input) => {
+	const match = lchaMatcher.exec(input);
+	if (!match) return null;
+	const [, l, c, h, unit, alpha] = match;
+	return lchaToRgb(clampLch({
+		l: Number.parseFloat(l),
+		c: Number.parseFloat(c),
+		h: parseHue(h, unit),
+		alpha: parseAlpha(alpha)
+	}));
+};
+const rgbToLchString = (rgb) => {
+	const { l, c, h, alpha } = roundLch(rgbToLch(rgb));
+	return alpha < 1 ? `lch(${l}% ${c} ${h} / ${alpha})` : `lch(${l}% ${c} ${h})`;
+};
+
+//#endregion
+//#region src/plugins/lch.ts
+/**
+* A plugin adding support for CIELCH color space.
+* https://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/
+* https://en.wikipedia.org/wiki/CIELAB_color_space#Cylindrical_model
+*/
+const lchPlugin = (ColordClass, parsers) => {
+	ColordClass.prototype.toLch = function toLch() {
+		return roundLch(rgbToLch(this.rgb));
+	};
+	ColordClass.prototype.toLchString = function toLchString() {
+		return rgbToLchString(this.rgb);
+	};
+	parsers.string.push([parseLchString, "lch"]);
+	parsers.object.push([parseLch, "lch"]);
+};
+var lch_default = lchPlugin;
+
+//#endregion
+export { lch_default as default, lchPlugin };

package/dist/plugins/minify.d.ts

@@ -0,0 +1,23 @@
+import { t as Plugin } from "../extend-DrPfn2Q1.js";
+
+//#region src/plugins/minify.d.ts
+interface MinificationOptions {
+  hex?: boolean;
+  alphaHex?: boolean;
+  rgb?: boolean;
+  hsl?: boolean;
+  name?: boolean;
+  transparent?: boolean;
+}
+declare module '../colord' {
+  interface Colord {
+    /** Returns the shortest string representation of the color */
+    minify(options?: MinificationOptions): string;
+  }
+}
+/**
+ * A plugin adding a color minification utilities.
+ */
+declare const minifyPlugin: Plugin;
+//#endregion
+export { minifyPlugin as default, minifyPlugin };

package/dist/plugins/minify.js

@@ -0,0 +1,61 @@
+import { c as round } from "../utils-BgIyY6bK.js";
+
+//#region src/plugins/minify.ts
+/**
+* A plugin adding a color minification utilities.
+*/
+const minifyPlugin = (ColordClass) => {
+	const minifyHex = (instance) => {
+		const hex = instance.toHex();
+		const alpha = instance.alpha();
+		const [, r1, r2, g1, g2, b1, b2, a1, a2] = hex.split("");
+		if (alpha > 0 && alpha < 1 && round(Number.parseInt(a1 + a2, 16) / 255, 2) !== alpha) return null;
+		if (r1 === r2 && g1 === g2 && b1 === b2) {
+			if (alpha === 1) return `#${r1}${g1}${b1}`;
+			else if (a1 === a2) return `#${r1}${g1}${b1}${a1}`;
+		}
+		return hex;
+	};
+	const findShortestString = (variants) => {
+		let shortest = variants[0];
+		for (let index = 1; index < variants.length; index += 1) if (variants[index].length < shortest.length) shortest = variants[index];
+		return shortest;
+	};
+	const shortenNumber = (number) => {
+		if (number > 0 && number < 1) return number.toString().replace("0.", ".");
+		return number;
+	};
+	ColordClass.prototype.minify = function minify(options = {}) {
+		const rgb = this.toRgb();
+		const r = shortenNumber(rgb.r);
+		const g = shortenNumber(rgb.g);
+		const b = shortenNumber(rgb.b);
+		const hsl = this.toHsl();
+		const h = shortenNumber(hsl.h);
+		const s = shortenNumber(hsl.s);
+		const l = shortenNumber(hsl.l);
+		const a = shortenNumber(this.alpha());
+		const settings = Object.assign({
+			hex: true,
+			rgb: true,
+			hsl: true
+		}, options);
+		const variants = [];
+		if (settings.hex && (a === 1 || settings.alphaHex)) {
+			const hex = minifyHex(this);
+			if (hex) variants.push(hex);
+		}
+		if (settings.rgb) variants.push(a === 1 ? `rgb(${r},${g},${b})` : `rgb(${r},${g},${b},${a})`);
+		if (settings.hsl) variants.push(a === 1 ? `hsl(${h},${s}%,${l}%)` : `hsl(${h},${s}%,${l}%,${a})`);
+		if (settings.transparent && r === 0 && g === 0 && b === 0 && a === 0) variants.push("transparent");
+		else if (a === 1 && settings.name && typeof this.toName === "function") {
+			const name = this.toName();
+			if (name) variants.push(name);
+		}
+		return findShortestString(variants);
+	};
+};
+var minify_default = minifyPlugin;
+
+//#endregion
+export { minify_default as default, minifyPlugin };

package/dist/plugins/mix.d.ts

@@ -0,0 +1,30 @@
+import { r as AnyColor } from "../colord-xpgrVWRV.js";
+import { t as Plugin } from "../extend-DrPfn2Q1.js";
+
+//#region src/plugins/mix.d.ts
+declare module '../colord' {
+  interface Colord {
+    /**
+     * Produces a mixture of two colors through CIE LAB color space and returns a new Colord instance.
+     */
+    mix(color2: AnyColor | Colord, ratio?: number): Colord;
+    /**
+     * Generates a tints palette based on original color.
+     */
+    tints(count?: number): Colord[];
+    /**
+     * Generates a shades palette based on original color.
+     */
+    shades(count?: number): Colord[];
+    /**
+     * Generates a tones palette based on original color.
+     */
+    tones(count?: number): Colord[];
+  }
+}
+/**
+ * A plugin adding a color mixing utilities.
+ */
+declare const mixPlugin: Plugin;
+//#endregion
+export { mixPlugin as default, mixPlugin };

package/dist/plugins/mix.js

@@ -0,0 +1,39 @@
+import "../utils-BgIyY6bK.js";
+import "../rgb-CfVJB1Bj.js";
+import "../hsv-UWMaaOSN.js";
+import { i as mix } from "../manipulate-CeAgrUd6.js";
+import "../xyz-MII3ndWO.js";
+import "../lab-CJHLdqfe.js";
+
+//#region src/plugins/mix.ts
+/**
+* A plugin adding a color mixing utilities.
+*/
+const mixPlugin = (ColordClass) => {
+	ColordClass.prototype.mix = function mix$1(color2, ratio = .5) {
+		const instance2 = color2 instanceof ColordClass ? color2 : new ColordClass(color2);
+		return new ColordClass(mix(this.toRgb(), instance2.toRgb(), ratio));
+	};
+	/**
+	* Generate a palette from mixing a source color with another.
+	*/
+	function mixPalette(source, hex, count = 5) {
+		const palette = [];
+		const step = 1 / (count - 1);
+		for (let i = 0; i <= count - 1; i += 1) palette.push(source.mix(hex, step * i));
+		return palette;
+	}
+	ColordClass.prototype.tints = function tints(count) {
+		return mixPalette(this, "#fff", count);
+	};
+	ColordClass.prototype.shades = function shades(count) {
+		return mixPalette(this, "#000", count);
+	};
+	ColordClass.prototype.tones = function tones(count) {
+		return mixPalette(this, "#808080", count);
+	};
+};
+var mix_default = mixPlugin;
+
+//#endregion
+export { mix_default as default, mixPlugin };

package/dist/plugins/names.d.ts

@@ -0,0 +1,22 @@
+import { t as Plugin } from "../extend-DrPfn2Q1.js";
+
+//#region src/plugins/names.d.ts
+interface ConvertOptions {
+  closest?: boolean;
+}
+declare module '../colord' {
+  interface Colord {
+    /** Finds CSS color keyword that matches with the color value */
+    toName(options?: ConvertOptions): string | undefined;
+  }
+}
+/**
+ * Plugin to work with named colors.
+ * Adds a parser to read CSS color names and `toName` method.
+ * See https://www.w3.org/TR/css-color-4/#named-colors
+ * Supports 'transparent' string as defined in
+ * https://drafts.csswg.org/css-color/#transparent-color
+ */
+declare const namesPlugin: Plugin;
+//#endregion
+export { namesPlugin as default, namesPlugin };

package/dist/plugins/names.js

@@ -0,0 +1,201 @@
+//#region src/plugins/names.ts
+/**
+* Plugin to work with named colors.
+* Adds a parser to read CSS color names and `toName` method.
+* See https://www.w3.org/TR/css-color-4/#named-colors
+* Supports 'transparent' string as defined in
+* https://drafts.csswg.org/css-color/#transparent-color
+*/
+const namesPlugin = (ColordClass, parsers) => {
+	const NAME_HEX_STORE = {
+		white: "#ffffff",
+		bisque: "#ffe4c4",
+		blue: "#0000ff",
+		cadetblue: "#5f9ea0",
+		chartreuse: "#7fff00",
+		chocolate: "#d2691e",
+		coral: "#ff7f50",
+		antiquewhite: "#faebd7",
+		aqua: "#00ffff",
+		azure: "#f0ffff",
+		whitesmoke: "#f5f5f5",
+		papayawhip: "#ffefd5",
+		plum: "#dda0dd",
+		blanchedalmond: "#ffebcd",
+		black: "#000000",
+		gold: "#ffd700",
+		goldenrod: "#daa520",
+		gainsboro: "#dcdcdc",
+		cornsilk: "#fff8dc",
+		cornflowerblue: "#6495ed",
+		burlywood: "#deb887",
+		aquamarine: "#7fffd4",
+		beige: "#f5f5dc",
+		crimson: "#dc143c",
+		cyan: "#00ffff",
+		darkblue: "#00008b",
+		darkcyan: "#008b8b",
+		darkgoldenrod: "#b8860b",
+		darkkhaki: "#bdb76b",
+		darkgray: "#a9a9a9",
+		darkgreen: "#006400",
+		darkgrey: "#a9a9a9",
+		peachpuff: "#ffdab9",
+		darkmagenta: "#8b008b",
+		darkred: "#8b0000",
+		darkorchid: "#9932cc",
+		darkorange: "#ff8c00",
+		darkslateblue: "#483d8b",
+		gray: "#808080",
+		darkslategray: "#2f4f4f",
+		darkslategrey: "#2f4f4f",
+		deeppink: "#ff1493",
+		deepskyblue: "#00bfff",
+		wheat: "#f5deb3",
+		firebrick: "#b22222",
+		floralwhite: "#fffaf0",
+		ghostwhite: "#f8f8ff",
+		darkviolet: "#9400d3",
+		magenta: "#ff00ff",
+		green: "#008000",
+		dodgerblue: "#1e90ff",
+		grey: "#808080",
+		honeydew: "#f0fff0",
+		hotpink: "#ff69b4",
+		blueviolet: "#8a2be2",
+		forestgreen: "#228b22",
+		lawngreen: "#7cfc00",
+		indianred: "#cd5c5c",
+		indigo: "#4b0082",
+		fuchsia: "#ff00ff",
+		brown: "#a52a2a",
+		maroon: "#800000",
+		mediumblue: "#0000cd",
+		lightcoral: "#f08080",
+		darkturquoise: "#00ced1",
+		lightcyan: "#e0ffff",
+		ivory: "#fffff0",
+		lightyellow: "#ffffe0",
+		lightsalmon: "#ffa07a",
+		lightseagreen: "#20b2aa",
+		linen: "#faf0e6",
+		mediumaquamarine: "#66cdaa",
+		lemonchiffon: "#fffacd",
+		lime: "#00ff00",
+		khaki: "#f0e68c",
+		mediumseagreen: "#3cb371",
+		limegreen: "#32cd32",
+		mediumspringgreen: "#00fa9a",
+		lightskyblue: "#87cefa",
+		lightblue: "#add8e6",
+		midnightblue: "#191970",
+		lightpink: "#ffb6c1",
+		mistyrose: "#ffe4e1",
+		moccasin: "#ffe4b5",
+		mintcream: "#f5fffa",
+		lightslategray: "#778899",
+		lightslategrey: "#778899",
+		navajowhite: "#ffdead",
+		navy: "#000080",
+		mediumvioletred: "#c71585",
+		powderblue: "#b0e0e6",
+		palegoldenrod: "#eee8aa",
+		oldlace: "#fdf5e6",
+		paleturquoise: "#afeeee",
+		mediumturquoise: "#48d1cc",
+		mediumorchid: "#ba55d3",
+		rebeccapurple: "#663399",
+		lightsteelblue: "#b0c4de",
+		mediumslateblue: "#7b68ee",
+		thistle: "#d8bfd8",
+		tan: "#d2b48c",
+		orchid: "#da70d6",
+		mediumpurple: "#9370db",
+		purple: "#800080",
+		pink: "#ffc0cb",
+		skyblue: "#87ceeb",
+		springgreen: "#00ff7f",
+		palegreen: "#98fb98",
+		red: "#ff0000",
+		yellow: "#ffff00",
+		slateblue: "#6a5acd",
+		lavenderblush: "#fff0f5",
+		peru: "#cd853f",
+		palevioletred: "#db7093",
+		violet: "#ee82ee",
+		teal: "#008080",
+		slategray: "#708090",
+		slategrey: "#708090",
+		aliceblue: "#f0f8ff",
+		darkseagreen: "#8fbc8f",
+		darkolivegreen: "#556b2f",
+		greenyellow: "#adff2f",
+		seagreen: "#2e8b57",
+		seashell: "#fff5ee",
+		tomato: "#ff6347",
+		silver: "#c0c0c0",
+		sienna: "#a0522d",
+		lavender: "#e6e6fa",
+		lightgreen: "#90ee90",
+		orange: "#ffa500",
+		orangered: "#ff4500",
+		steelblue: "#4682b4",
+		royalblue: "#4169e1",
+		turquoise: "#40e0d0",
+		yellowgreen: "#9acd32",
+		salmon: "#fa8072",
+		saddlebrown: "#8b4513",
+		sandybrown: "#f4a460",
+		rosybrown: "#bc8f8f",
+		darksalmon: "#e9967a",
+		lightgoldenrodyellow: "#fafad2",
+		snow: "#fffafa",
+		lightgrey: "#d3d3d3",
+		lightgray: "#d3d3d3",
+		dimgray: "#696969",
+		dimgrey: "#696969",
+		olivedrab: "#6b8e23",
+		olive: "#808000"
+	};
+	const nameHexEntries = Object.entries(NAME_HEX_STORE);
+	const HEX_NAME_STORE = {};
+	nameHexEntries.forEach(([name, hex]) => {
+		HEX_NAME_STORE[hex] = name;
+	});
+	const NAME_RGBA_STORE = {};
+	const getDistanceBetween = (rgb1, rgb2) => {
+		return (rgb1.r - rgb2.r) ** 2 + (rgb1.g - rgb2.g) ** 2 + (rgb1.b - rgb2.b) ** 2;
+	};
+	ColordClass.prototype.toName = function toName(options) {
+		if (!this.rgb.alpha && !this.rgb.r && !this.rgb.g && !this.rgb.b) return "transparent";
+		const exactMatch = HEX_NAME_STORE[this.toHex()];
+		if (exactMatch) return exactMatch;
+		if (options?.closest) {
+			const rgb = this.toRgb();
+			let minDistance = Infinity;
+			let closestMatch = "black";
+			if (!NAME_RGBA_STORE.length) nameHexEntries.forEach(([name, hex]) => {
+				NAME_RGBA_STORE[name] = new ColordClass(hex).toRgb();
+			});
+			nameHexEntries.forEach(([name, hex]) => {
+				const distance = getDistanceBetween(rgb, new ColordClass(hex).toRgb());
+				if (distance < minDistance) {
+					minDistance = distance;
+					closestMatch = name;
+				}
+			});
+			return closestMatch;
+		}
+	};
+	const parseColorName = (input) => {
+		const name = input.toLowerCase();
+		const hex = name === "transparent" ? "#0000" : NAME_HEX_STORE[name];
+		if (hex) return new ColordClass(hex).toRgb();
+		return null;
+	};
+	parsers.string.push([parseColorName, "name"]);
+};
+var names_default = namesPlugin;
+
+//#endregion
+export { names_default as default, namesPlugin };

package/dist/plugins/oklab.d.ts

@@ -0,0 +1,16 @@
+import { f as OklabColor } from "../colord-xpgrVWRV.js";
+import { t as Plugin } from "../extend-DrPfn2Q1.js";
+
+//#region src/plugins/oklab.d.ts
+declare module '../colord' {
+  interface Colord {
+    toOklab(): OklabColor;
+  }
+}
+/**
+ * A plugin adding support for OKLAB colorspace.
+ * https://bottosson.github.io/posts/oklab/
+ */
+declare const oklabPlugin: Plugin;
+//#endregion
+export { oklabPlugin as default, oklabPlugin };

package/dist/plugins/oklab.js

@@ -0,0 +1,103 @@
+import { _ as ALPHA_PRECISION, a as mul3x3, c as round, g as OKLAB_M2_INV, h as OKLAB_M2, i as isPresent, m as OKLAB_M1_INV, o as parseAlpha, p as OKLAB_M1, t as clamp } from "../utils-BgIyY6bK.js";
+import { n as clampRgb, o as rgbToLinearRgb, r as linearRgbToRgb, t as clampLinearRgb } from "../rgb-CfVJB1Bj.js";
+
+//#region src/models/oklab.ts
+const clampOklab = (oklab) => {
+	const { l, a, b, alpha } = oklab;
+	return {
+		l: clamp(l, 1e-4, 1),
+		a: clamp(a, -.4, .4),
+		b: clamp(b, -.4, .4),
+		alpha: clamp(alpha)
+	};
+};
+const roundOklab = (oklab) => {
+	const { l, a, b, alpha } = oklab;
+	return {
+		l: round(l, 3),
+		a: round(a, 3),
+		b: round(b, 3),
+		alpha: round(alpha, ALPHA_PRECISION)
+	};
+};
+const oklabToRgb = (oklab) => {
+	const [r, g, b] = mul3x3(OKLAB_M1_INV, mul3x3(OKLAB_M2_INV, [
+		oklab.l,
+		oklab.a,
+		oklab.b
+	]).map((v) => v * v * v));
+	return clampRgb(linearRgbToRgb(clampLinearRgb({
+		r,
+		g,
+		b,
+		alpha: oklab.alpha
+	})));
+};
+const rgbToOklab = (rgb) => {
+	const lRgb = rgbToLinearRgb(rgb);
+	const [l, a, b] = mul3x3(OKLAB_M2, mul3x3(OKLAB_M1, [
+		lRgb.r,
+		lRgb.g,
+		lRgb.b
+	]).map((v) => Math.cbrt(v)));
+	return clampOklab({
+		l,
+		a,
+		b,
+		alpha: rgb.alpha
+	});
+};
+const parseOklab = ({ l, a, b, alpha = 1 }) => {
+	if (!isPresent(l) || !isPresent(a) || !isPresent(b)) return null;
+	return oklabToRgb(clampOklab({
+		l: Number(l),
+		a: Number(a),
+		b: Number(b),
+		alpha: Number(alpha)
+	}));
+};
+/**
+* Parsing syntax: oklab(L a b [/ alpha])
+* - L: <number|percentage>
+* - a: <number>
+* - b: <number>
+* - alpha: <number|percentage>
+*/
+const oklabMatcher = /^oklab\(\s*([+-]?[\d.]+)%?\s+([+-]?[\d.]+)\s+([+-]?[\d.]+)(?:\s*\/\s*([+-]?[\d.]+%?))?\s*\)$/i;
+/**
+* Parses a valid OKLAB CSS color function/string
+* https://www.w3.org/TR/css-color-4/#specifying-oklab
+* @param input
+* @returns
+*/
+const parseOklabString = (input) => {
+	const match = oklabMatcher.exec(input);
+	if (!match) return null;
+	const [_, L, a, b, alpha] = match;
+	let l = Number.parseFloat(L);
+	if (L.endsWith("%")) l /= 100;
+	return oklabToRgb(clampOklab({
+		l,
+		a: Number.parseFloat(a),
+		b: Number.parseFloat(b),
+		alpha: parseAlpha(alpha)
+	}));
+};
+
+//#endregion
+//#region src/plugins/oklab.ts
+/**
+* A plugin adding support for OKLAB colorspace.
+* https://bottosson.github.io/posts/oklab/
+*/
+const oklabPlugin = (ColordClass, parsers) => {
+	ColordClass.prototype.toOklab = function toOklab() {
+		return roundOklab(rgbToOklab(this.rgb));
+	};
+	parsers.string.push([parseOklabString, "oklab"]);
+	parsers.object.push([parseOklab, "oklab"]);
+};
+var oklab_default = oklabPlugin;
+
+//#endregion
+export { oklab_default as default, oklabPlugin };

package/dist/plugins/oklch.d.ts

@@ -0,0 +1,16 @@
+import { p as OklchColor } from "../colord-xpgrVWRV.js";
+import { t as Plugin } from "../extend-DrPfn2Q1.js";
+
+//#region src/plugins/oklch.d.ts
+declare module '../colord' {
+  interface Colord {
+    toOklch(): OklchColor;
+  }
+}
+/**
+ * A plugin adding support for OKLCH colorspace.
+ * https://bottosson.github.io/posts/oklab/
+ */
+declare const oklchPlugin: Plugin;
+//#endregion
+export { oklchPlugin as default, oklchPlugin };