feat(auth): implement user authentication system

2026-03-19 23:10:50 +00:00 · 2026-03-19 23:10:50 +00:00 · 25cea4fbe8
commit 25cea4fbe8
parent 4847ab793a
12051 changed files with 1462377 additions and 0 deletions
--- a/backend/node_modules/color-convert/LICENSE
+++ b/backend/node_modules/color-convert/LICENSE
@ -0,0 +1,22 @@
+Copyright (c) 2011-2016 Heather Arthur <fayearthur@gmail.com>.
+Copyright (c) 2016-2021 Josh Junon <josh@junon.me>.
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
--- a/backend/node_modules/color-convert/README.md
+++ b/backend/node_modules/color-convert/README.md
@ -0,0 +1,165 @@
+# color-convert
+
+Color-convert is a color conversion library for JavaScript and node.
+It converts all ways between `rgb`, `hsl`, `hsv`, `hwb`, `cmyk`, `ansi`, `ansi16`, `hex` strings, and CSS `keyword`s (will round to closest):
+
+```js
+import convert from 'color-convert';
+
+convert.rgb.hsl(140, 200, 100);             // [96, 48, 59]
+convert.keyword.rgb('blue');                // [0, 0, 255]
+
+const rgbChannels = convert.rgb.channels;     // 3
+const cmykChannels = convert.cmyk.channels;   // 4
+const ansiChannels = convert.ansi16.channels; // 1
+```
+
+# Install
+
+```sh
+npm install color-convert
+```
+
+# API
+
+Simply get the property of the _from_ and _to_ conversion that you're looking for.
+
+All functions have a rounded and unrounded variant. By default, return values are rounded. To get the unrounded (raw) results, simply tack on `.raw` to the function.
+
+All 'from' functions have a hidden property called `.channels` that indicates the number of channels the function expects (not including alpha).
+
+```js
+import convert from 'color-convert';
+
+// Hex to LAB
+convert.hex.lab('DEADBF');         // [ 76, 21, -2 ]
+convert.hex.lab.raw('DEADBF');     // [ 75.56213190997677, 20.653827952644754, -2.290532499330533 ]
+
+// RGB to CMYK
+convert.rgb.cmyk(167, 255, 4);     // [ 35, 0, 98, 0 ]
+convert.rgb.cmyk.raw(167, 255, 4); // [ 34.509803921568626, 0, 98.43137254901961, 0 ]
+```
+
+### Arrays
+All functions that accept multiple arguments also support passing an array.
+
+Note that this does **not** apply to functions that convert from a color that only requires one value (e.g. `keyword`, `ansi256`, `hex`, etc.)
+
+```js
+import convert from 'color-convert';
+
+convert.rgb.hex(123, 45, 67);      // '7B2D43'
+convert.rgb.hex([123, 45, 67]);    // '7B2D43'
+```
+
+## Routing
+
+Conversions that don't have an _explicitly_ defined conversion (in [conversions.js](conversions.js)), but can be converted by means of sub-conversions (e.g. XYZ -> **RGB** -> CMYK), are automatically routed together. This allows just about any color model supported by `color-convert` to be converted to any other model, so long as a sub-conversion path exists. This is also true for conversions requiring more than one step in between (e.g. LCH -> **LAB** -> **XYZ** -> **RGB** -> Hex).
+
+Keep in mind that extensive conversions _may_ result in a loss of precision, and exist only to be complete. For a list of "direct" (single-step) conversions, see [conversions.js](conversions.js).
+
+## Color Space Scales
+Conversions rely on an agreed upon 'full-scale' value for each of the channels. Listed here are those values for the most common color spaces
+
+### rgb
+channel | full-scale value
+---|---
+r | 255
+g | 255
+b | 255
+
+### hsl
+channel | full-scale value
+---|---
+h | 360
+s | 100
+l | 100
+
+### hsv
+channel | full-scale value
+---|---
+h | 360
+s | 100
+v | 100
+
+### hwb
+channel | full-scale value
+---|---
+h | 360
+w | 100
+b | 100
+
+### xyz
+channel | full-scale value
+---|---
+x | 94
+y | 99
+z | 108
+
+### lab
+channel | full-scale value
+---|---
+l | 100
+a | -86, 98
+b | -108, 94
+
+### lch
+channel | full-scale value
+---|---
+l | 100
+c | 133
+h | 360
+
+### oklab
+channel | full-scale value
+---|---
+l | 100
+a | -23, 28
+b | -31, 20
+
+### oklch
+channel | full-scale value
+---|---
+l | 100
+c | 32
+h | 360
+
+### cmyk
+channel | full-scale value
+---|---
+c | 100
+m | 100
+y | 100
+k | 100
+
+### hex
+channel | full-scale value
+---|---
+hex | ```0xffffff```
+
+### keyword
+channel | value
+---|---
+name | any key from [color-name](https://github.com/colorjs/color-name/blob/master/index.js)
+
+### apple
+channel | full-scale value
+---|---
+0 | 65535
+1 | 65535
+2 | 65535
+
+### gray
+channel | full-scale value
+---|---
+gray | 100
+
+# Contribute
+
+If there is a new model you would like to support, or want to add a direct conversion between two existing models, please send us a pull request.
+
+# License
+Copyright &copy; 2011-2016, Heather Arthur.
+Copyright &copy; 2016-2021, Josh Junon.
+
+Licensed under the [MIT License](LICENSE).
--- a/backend/node_modules/color-convert/conversions.js
+++ b/backend/node_modules/color-convert/conversions.js
@ -0,0 +1,980 @@
+/* MIT license */
+/* eslint-disable no-mixed-operators */
+import cssKeywords from 'color-name';
+
+// NOTE: conversions should only return primitive values (i.e. arrays, or
+//       values that give correct `typeof` results).
+//       do not use box values types (i.e. Number(), String(), etc.)
+
+const reverseKeywords = {};
+for (const key of Object.keys(cssKeywords)) {
+	reverseKeywords[cssKeywords[key]] = key;
+}
+
+const convert = {
+	rgb: {channels: 3, labels: 'rgb'},
+	hsl: {channels: 3, labels: 'hsl'},
+	hsv: {channels: 3, labels: 'hsv'},
+	hwb: {channels: 3, labels: 'hwb'},
+	cmyk: {channels: 4, labels: 'cmyk'},
+	xyz: {channels: 3, labels: 'xyz'},
+	lab: {channels: 3, labels: 'lab'},
+	oklab: {channels: 3, labels: ['okl', 'oka', 'okb']},
+	lch: {channels: 3, labels: 'lch'},
+	oklch: {channels: 3, labels: ['okl', 'okc', 'okh']},
+	hex: {channels: 1, labels: ['hex']},
+	keyword: {channels: 1, labels: ['keyword']},
+	ansi16: {channels: 1, labels: ['ansi16']},
+	ansi256: {channels: 1, labels: ['ansi256']},
+	hcg: {channels: 3, labels: ['h', 'c', 'g']},
+	apple: {channels: 3, labels: ['r16', 'g16', 'b16']},
+	gray: {channels: 1, labels: ['gray']},
+};
+
+export default convert;
+
+// LAB f(t) constant
+const LAB_FT = (6 / 29) ** 3;
+
+// SRGB non-linear transform functions
+function srgbNonlinearTransform(c) {
+	const cc = c > 0.003_130_8
+		? ((1.055 * (c ** (1 / 2.4))) - 0.055)
+		: c * 12.92;
+	return Math.min(Math.max(0, cc), 1);
+}
+
+function srgbNonlinearTransformInv(c) {
+	return c > 0.040_45 ? (((c + 0.055) / 1.055) ** 2.4) : (c / 12.92);
+}
+
+// Hide .channels and .labels properties
+for (const model of Object.keys(convert)) {
+	if (!('channels' in convert[model])) {
+		throw new Error('missing channels property: ' + model);
+	}
+
+	if (!('labels' in convert[model])) {
+		throw new Error('missing channel labels property: ' + model);
+	}
+
+	if (convert[model].labels.length !== convert[model].channels) {
+		throw new Error('channel and label counts mismatch: ' + model);
+	}
+
+	const {channels, labels} = convert[model];
+	delete convert[model].channels;
+	delete convert[model].labels;
+	Object.defineProperty(convert[model], 'channels', {value: channels});
+	Object.defineProperty(convert[model], 'labels', {value: labels});
+}
+
+convert.rgb.hsl = function (rgb) {
+	const r = rgb[0] / 255;
+	const g = rgb[1] / 255;
+	const b = rgb[2] / 255;
+	const min = Math.min(r, g, b);
+	const max = Math.max(r, g, b);
+	const delta = max - min;
+	let h;
+	let s;
+
+	switch (max) {
+		case min: {
+			h = 0;
+
+			break;
+		}
+
+		case r: {
+			h = (g - b) / delta;
+
+			break;
+		}
+
+		case g: {
+			h = 2 + (b - r) / delta;
+
+			break;
+		}
+
+		case b: {
+			h = 4 + (r - g) / delta;
+
+			break;
+		}
+	// No default
+	}
+
+	h = Math.min(h * 60, 360);
+
+	if (h < 0) {
+		h += 360;
+	}
+
+	const l = (min + max) / 2;
+
+	if (max === min) {
+		s = 0;
+	} else if (l <= 0.5) {
+		s = delta / (max + min);
+	} else {
+		s = delta / (2 - max - min);
+	}
+
+	return [h, s * 100, l * 100];
+};
+
+convert.rgb.hsv = function (rgb) {
+	let rdif;
+	let gdif;
+	let bdif;
+	let h;
+	let s;
+
+	const r = rgb[0] / 255;
+	const g = rgb[1] / 255;
+	const b = rgb[2] / 255;
+	const v = Math.max(r, g, b);
+	const diff = v - Math.min(r, g, b);
+	const diffc = function (c) {
+		return (v - c) / 6 / diff + 1 / 2;
+	};
+
+	if (diff === 0) {
+		h = 0;
+		s = 0;
+	} else {
+		s = diff / v;
+		rdif = diffc(r);
+		gdif = diffc(g);
+		bdif = diffc(b);
+
+		switch (v) {
+			case r: {
+				h = bdif - gdif;
+
+				break;
+			}
+
+			case g: {
+				h = (1 / 3) + rdif - bdif;
+
+				break;
+			}
+
+			case b: {
+				h = (2 / 3) + gdif - rdif;
+
+				break;
+			}
+		// No default
+		}
+
+		if (h < 0) {
+			h += 1;
+		} else if (h > 1) {
+			h -= 1;
+		}
+	}
+
+	return [
+		h * 360,
+		s * 100,
+		v * 100,
+	];
+};
+
+convert.rgb.hwb = function (rgb) {
+	const r = rgb[0];
+	const g = rgb[1];
+	let b = rgb[2];
+	const h = convert.rgb.hsl(rgb)[0];
+	const w = 1 / 255 * Math.min(r, Math.min(g, b));
+
+	b = 1 - 1 / 255 * Math.max(r, Math.max(g, b));
+
+	return [h, w * 100, b * 100];
+};
+
+convert.rgb.oklab = function (rgb) {
+	// Assume sRGB
+	const r = srgbNonlinearTransformInv(rgb[0] / 255);
+	const g = srgbNonlinearTransformInv(rgb[1] / 255);
+	const b = srgbNonlinearTransformInv(rgb[2] / 255);
+
+	const lp = Math.cbrt(0.412_221_470_8 * r + 0.536_332_536_3 * g + 0.051_445_992_9 * b);
+	const mp = Math.cbrt(0.211_903_498_2 * r + 0.680_699_545_1 * g + 0.107_396_956_6 * b);
+	const sp = Math.cbrt(0.088_302_461_9 * r + 0.281_718_837_6 * g + 0.629_978_700_5 * b);
+
+	const l = 0.210_454_255_3 * lp + 0.793_617_785 * mp - 0.004_072_046_8 * sp;
+	const aa = 1.977_998_495_1 * lp - 2.428_592_205 * mp + 0.450_593_709_9 * sp;
+	const bb = 0.025_904_037_1 * lp + 0.782_771_766_2 * mp - 0.808_675_766 * sp;
+
+	return [l * 100, aa * 100, bb * 100];
+};
+
+convert.rgb.cmyk = function (rgb) {
+	const r = rgb[0] / 255;
+	const g = rgb[1] / 255;
+	const b = rgb[2] / 255;
+
+	const k = Math.min(1 - r, 1 - g, 1 - b);
+	const c = (1 - r - k) / (1 - k) || 0;
+	const m = (1 - g - k) / (1 - k) || 0;
+	const y = (1 - b - k) / (1 - k) || 0;
+
+	return [c * 100, m * 100, y * 100, k * 100];
+};
+
+function comparativeDistance(x, y) {
+	/*
+		See https://en.m.wikipedia.org/wiki/Euclidean_distance#Squared_Euclidean_distance
+	*/
+	return (
+		((x[0] - y[0]) ** 2) +
+		((x[1] - y[1]) ** 2) +
+		((x[2] - y[2]) ** 2)
+	);
+}
+
+convert.rgb.keyword = function (rgb) {
+	const reversed = reverseKeywords[rgb];
+	if (reversed) {
+		return reversed;
+	}
+
+	let currentClosestDistance = Number.POSITIVE_INFINITY;
+	let currentClosestKeyword;
+
+	for (const keyword of Object.keys(cssKeywords)) {
+		const value = cssKeywords[keyword];
+
+		// Compute comparative distance
+		const distance = comparativeDistance(rgb, value);
+
+		// Check if its less, if so set as closest
+		if (distance < currentClosestDistance) {
+			currentClosestDistance = distance;
+			currentClosestKeyword = keyword;
+		}
+	}
+
+	return currentClosestKeyword;
+};
+
+convert.keyword.rgb = function (keyword) {
+	return [...cssKeywords[keyword]];
+};
+
+convert.rgb.xyz = function (rgb) {
+	// Assume sRGB
+	const r = srgbNonlinearTransformInv(rgb[0] / 255);
+	const g = srgbNonlinearTransformInv(rgb[1] / 255);
+	const b = srgbNonlinearTransformInv(rgb[2] / 255);
+
+	const x = (r * 0.412_456_4) + (g * 0.357_576_1) + (b * 0.180_437_5);
+	const y = (r * 0.212_672_9) + (g * 0.715_152_2) + (b * 0.072_175);
+	const z = (r * 0.019_333_9) + (g * 0.119_192) + (b * 0.950_304_1);
+
+	return [x * 100, y * 100, z * 100];
+};
+
+convert.rgb.lab = function (rgb) {
+	const xyz = convert.rgb.xyz(rgb);
+	let x = xyz[0];
+	let y = xyz[1];
+	let z = xyz[2];
+
+	x /= 95.047;
+	y /= 100;
+	z /= 108.883;
+
+	x = x > LAB_FT ? (x ** (1 / 3)) : (7.787 * x) + (16 / 116);
+	y = y > LAB_FT ? (y ** (1 / 3)) : (7.787 * y) + (16 / 116);
+	z = z > LAB_FT ? (z ** (1 / 3)) : (7.787 * z) + (16 / 116);
+
+	const l = (116 * y) - 16;
+	const a = 500 * (x - y);
+	const b = 200 * (y - z);
+
+	return [l, a, b];
+};
+
+convert.hsl.rgb = function (hsl) {
+	const h = hsl[0] / 360;
+	const s = hsl[1] / 100;
+	const l = hsl[2] / 100;
+	let t3;
+	let value;
+
+	if (s === 0) {
+		value = l * 255;
+		return [value, value, value];
+	}
+
+	const t2 = l < 0.5 ? l * (1 + s) : l + s - l * s;
+
+	const t1 = 2 * l - t2;
+
+	const rgb = [0, 0, 0];
+	for (let i = 0; i < 3; i++) {
+		t3 = h + 1 / 3 * -(i - 1);
+		if (t3 < 0) {
+			t3++;
+		}
+
+		if (t3 > 1) {
+			t3--;
+		}
+
+		if (6 * t3 < 1) {
+			value = t1 + (t2 - t1) * 6 * t3;
+		} else if (2 * t3 < 1) {
+			value = t2;
+		} else if (3 * t3 < 2) {
+			value = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
+		} else {
+			value = t1;
+		}
+
+		rgb[i] = value * 255;
+	}
+
+	return rgb;
+};
+
+convert.hsl.hsv = function (hsl) {
+	const h = hsl[0];
+	let s = hsl[1] / 100;
+	let l = hsl[2] / 100;
+	let smin = s;
+	const lmin = Math.max(l, 0.01);
+
+	l *= 2;
+	s *= (l <= 1) ? l : 2 - l;
+	smin *= lmin <= 1 ? lmin : 2 - lmin;
+	const v = (l + s) / 2;
+	const sv = l === 0 ? (2 * smin) / (lmin + smin) : (2 * s) / (l + s);
+
+	return [h, sv * 100, v * 100];
+};
+
+convert.hsv.rgb = function (hsv) {
+	const h = hsv[0] / 60;
+	const s = hsv[1] / 100;
+	let v = hsv[2] / 100;
+	const hi = Math.floor(h) % 6;
+
+	const f = h - Math.floor(h);
+	const p = 255 * v * (1 - s);
+	const q = 255 * v * (1 - (s * f));
+	const t = 255 * v * (1 - (s * (1 - f)));
+	v *= 255;
+
+	switch (hi) {
+		case 0: {
+			return [v, t, p];
+		}
+
+		case 1: {
+			return [q, v, p];
+		}
+
+		case 2: {
+			return [p, v, t];
+		}
+
+		case 3: {
+			return [p, q, v];
+		}
+
+		case 4: {
+			return [t, p, v];
+		}
+
+		case 5: {
+			return [v, p, q];
+		}
+	}
+};
+
+convert.hsv.hsl = function (hsv) {
+	const h = hsv[0];
+	const s = hsv[1] / 100;
+	const v = hsv[2] / 100;
+	const vmin = Math.max(v, 0.01);
+	let sl;
+	let l;
+
+	l = (2 - s) * v;
+	const lmin = (2 - s) * vmin;
+	sl = s * vmin;
+	sl /= (lmin <= 1) ? lmin : 2 - lmin;
+	sl = sl || 0;
+	l /= 2;
+
+	return [h, sl * 100, l * 100];
+};
+
+// http://dev.w3.org/csswg/css-color/#hwb-to-rgb
+convert.hwb.rgb = function (hwb) {
+	const h = hwb[0] / 360;
+	let wh = hwb[1] / 100;
+	let bl = hwb[2] / 100;
+	const ratio = wh + bl;
+	let f;
+
+	// Wh + bl cant be > 1
+	if (ratio > 1) {
+		wh /= ratio;
+		bl /= ratio;
+	}
+
+	const i = Math.floor(6 * h);
+	const v = 1 - bl;
+	f = 6 * h - i;
+
+	// eslint-disable-next-line no-bitwise
+	if ((i & 0x01) !== 0) {
+		f = 1 - f;
+	}
+
+	const n = wh + f * (v - wh); // Linear interpolation
+
+	let r;
+	let g;
+	let b;
+	/* eslint-disable max-statements-per-line,no-multi-spaces, default-case-last */
+	switch (i) {
+		default:
+		case 6:
+		case 0: { r = v;  g = n;  b = wh; break;
+		}
+
+		case 1: { r = n;  g = v;  b = wh; break;
+		}
+
+		case 2: { r = wh; g = v;  b = n; break;
+		}
+
+		case 3: { r = wh; g = n;  b = v; break;
+		}
+
+		case 4: { r = n;  g = wh; b = v; break;
+		}
+
+		case 5: { r = v;  g = wh; b = n; break;
+		}
+	}
+	/* eslint-enable max-statements-per-line,no-multi-spaces, default-case-last */
+
+	return [r * 255, g * 255, b * 255];
+};
+
+convert.cmyk.rgb = function (cmyk) {
+	const c = cmyk[0] / 100;
+	const m = cmyk[1] / 100;
+	const y = cmyk[2] / 100;
+	const k = cmyk[3] / 100;
+
+	const r = 1 - Math.min(1, c * (1 - k) + k);
+	const g = 1 - Math.min(1, m * (1 - k) + k);
+	const b = 1 - Math.min(1, y * (1 - k) + k);
+
+	return [r * 255, g * 255, b * 255];
+};
+
+convert.xyz.rgb = function (xyz) {
+	const x = xyz[0] / 100;
+	const y = xyz[1] / 100;
+	const z = xyz[2] / 100;
+	let r;
+	let g;
+	let b;
+
+	r = (x * 3.240_454_2) + (y * -1.537_138_5) + (z * -0.498_531_4);
+	g = (x * -0.969_266) + (y * 1.876_010_8) + (z * 0.041_556);
+	b = (x * 0.055_643_4) + (y * -0.204_025_9) + (z * 1.057_225_2);
+
+	// Assume sRGB
+	r = srgbNonlinearTransform(r);
+	g = srgbNonlinearTransform(g);
+	b = srgbNonlinearTransform(b);
+
+	return [r * 255, g * 255, b * 255];
+};
+
+convert.xyz.lab = function (xyz) {
+	let x = xyz[0];
+	let y = xyz[1];
+	let z = xyz[2];
+
+	x /= 95.047;
+	y /= 100;
+	z /= 108.883;
+
+	x = x > LAB_FT ? (x ** (1 / 3)) : (7.787 * x) + (16 / 116);
+	y = y > LAB_FT ? (y ** (1 / 3)) : (7.787 * y) + (16 / 116);
+	z = z > LAB_FT ? (z ** (1 / 3)) : (7.787 * z) + (16 / 116);
+
+	const l = (116 * y) - 16;
+	const a = 500 * (x - y);
+	const b = 200 * (y - z);
+
+	return [l, a, b];
+};
+
+convert.xyz.oklab = function (xyz) {
+	const x = xyz[0] / 100;
+	const y = xyz[1] / 100;
+	const z = xyz[2] / 100;
+
+	const lp = Math.cbrt(0.818_933_010_1 * x + 0.361_866_742_4 * y - 0.128_859_713_7 * z);
+	const mp = Math.cbrt(0.032_984_543_6 * x + 0.929_311_871_5 * y + 0.036_145_638_7 * z);
+	const sp = Math.cbrt(0.048_200_301_8 * x + 0.264_366_269_1 * y + 0.633_851_707 * z);
+
+	const l = 0.210_454_255_3 * lp + 0.793_617_785 * mp - 0.004_072_046_8 * sp;
+	const a = 1.977_998_495_1 * lp - 2.428_592_205 * mp + 0.450_593_709_9 * sp;
+	const b = 0.025_904_037_1 * lp + 0.782_771_766_2 * mp - 0.808_675_766 * sp;
+
+	return [l * 100, a * 100, b * 100];
+};
+
+convert.oklab.oklch = function (oklab) {
+	return convert.lab.lch(oklab);
+};
+
+convert.oklab.xyz = function (oklab) {
+	const ll = oklab[0] / 100;
+	const a = oklab[1] / 100;
+	const b = oklab[2] / 100;
+
+	const l = (0.999_999_998 * ll + 0.396_337_792 * a + 0.215_803_758 * b) ** 3;
+	const m = (1.000_000_008 * ll - 0.105_561_342 * a - 0.063_854_175 * b) ** 3;
+	const s = (1.000_000_055 * ll - 0.089_484_182 * a - 1.291_485_538 * b) ** 3;
+
+	const x = 1.227_013_851 * l - 0.557_799_98 * m + 0.281_256_149 * s;
+	const y = -0.040_580_178 * l + 1.112_256_87 * m - 0.071_676_679 * s;
+	const z = -0.076_381_285 * l - 0.421_481_978 * m + 1.586_163_22 * s;
+
+	return [x * 100, y * 100, z * 100];
+};
+
+convert.oklab.rgb = function (oklab) {
+	const ll = oklab[0] / 100;
+	const aa = oklab[1] / 100;
+	const bb = oklab[2] / 100;
+
+	const l = (ll + 0.396_337_777_4 * aa + 0.215_803_757_3 * bb) ** 3;
+	const m = (ll - 0.105_561_345_8 * aa - 0.063_854_172_8 * bb) ** 3;
+	const s = (ll - 0.089_484_177_5 * aa - 1.291_485_548 * bb) ** 3;
+
+	// Assume sRGB
+	const r = srgbNonlinearTransform(4.076_741_662_1 * l - 3.307_711_591_3 * m + 0.230_969_929_2 * s);
+	const g = srgbNonlinearTransform(-1.268_438_004_6 * l + 2.609_757_401_1 * m - 0.341_319_396_5 * s);
+	const b = srgbNonlinearTransform(-0.004_196_086_3 * l - 0.703_418_614_7 * m + 1.707_614_701 * s);
+
+	return [r * 255, g * 255, b * 255];
+};
+
+convert.oklch.oklab = function (oklch) {
+	return convert.lch.lab(oklch);
+};
+
+convert.lab.xyz = function (lab) {
+	const l = lab[0];
+	const a = lab[1];
+	const b = lab[2];
+	let x;
+	let y;
+	let z;
+
+	y = (l + 16) / 116;
+	x = a / 500 + y;
+	z = y - b / 200;
+
+	const y2 = y ** 3;
+	const x2 = x ** 3;
+	const z2 = z ** 3;
+	y = y2 > LAB_FT ? y2 : (y - 16 / 116) / 7.787;
+	x = x2 > LAB_FT ? x2 : (x - 16 / 116) / 7.787;
+	z = z2 > LAB_FT ? z2 : (z - 16 / 116) / 7.787;
+
+	// Illuminant D65 XYZ Tristrimulus Values
+	// https://en.wikipedia.org/wiki/CIE_1931_color_space
+	x *= 95.047;
+	y *= 100;
+	z *= 108.883;
+
+	return [x, y, z];
+};
+
+convert.lab.lch = function (lab) {
+	const l = lab[0];
+	const a = lab[1];
+	const b = lab[2];
+	let h;
+
+	const hr = Math.atan2(b, a);
+	h = hr * 360 / 2 / Math.PI;
+
+	if (h < 0) {
+		h += 360;
+	}
+
+	const c = Math.sqrt(a * a + b * b);
+
+	return [l, c, h];
+};
+
+convert.lch.lab = function (lch) {
+	const l = lch[0];
+	const c = lch[1];
+	const h = lch[2];
+
+	const hr = h / 360 * 2 * Math.PI;
+	const a = c * Math.cos(hr);
+	const b = c * Math.sin(hr);
+
+	return [l, a, b];
+};
+
+convert.rgb.ansi16 = function (args, saturation = null) {
+	const [r, g, b] = args;
+	let value = saturation === null ? convert.rgb.hsv(args)[2] : saturation; // Hsv -> ansi16 optimization
+
+	value = Math.round(value / 50);
+
+	if (value === 0) {
+		return 30;
+	}
+
+	let ansi = 30
+		/* eslint-disable no-bitwise */
+		+ ((Math.round(b / 255) << 2)
+		| (Math.round(g / 255) << 1)
+		| Math.round(r / 255));
+		/* eslint-enable no-bitwise */
+
+	if (value === 2) {
+		ansi += 60;
+	}
+
+	return ansi;
+};
+
+convert.hsv.ansi16 = function (args) {
+	// Optimization here; we already know the value and don't need to get
+	// it converted for us.
+	return convert.rgb.ansi16(convert.hsv.rgb(args), args[2]);
+};
+
+convert.rgb.ansi256 = function (args) {
+	const r = args[0];
+	const g = args[1];
+	const b = args[2];
+
+	// We use the extended greyscale palette here, with the exception of
+	// black and white. normal palette only has 4 greyscale shades.
+	// eslint-disable-next-line no-bitwise
+	if (r >> 4 === g >> 4 && g >> 4 === b >> 4) {
+		if (r < 8) {
+			return 16;
+		}
+
+		if (r > 248) {
+			return 231;
+		}
+
+		return Math.round(((r - 8) / 247) * 24) + 232;
+	}
+
+	const ansi = 16
+		+ (36 * Math.round(r / 255 * 5))
+		+ (6 * Math.round(g / 255 * 5))
+		+ Math.round(b / 255 * 5);
+
+	return ansi;
+};
+
+convert.ansi16.rgb = function (args) {
+	args = args[0];
+
+	let color = args % 10;
+
+	// Handle greyscale
+	if (color === 0 || color === 7) {
+		if (args > 50) {
+			color += 3.5;
+		}
+
+		color = color / 10.5 * 255;
+
+		return [color, color, color];
+	}
+
+	const mult = (Math.trunc(args > 50) + 1) * 0.5;
+	/* eslint-disable no-bitwise */
+	const r = ((color & 1) * mult) * 255;
+	const g = (((color >> 1) & 1) * mult) * 255;
+	const b = (((color >> 2) & 1) * mult) * 255;
+	/* eslint-enable no-bitwise */
+
+	return [r, g, b];
+};
+
+convert.ansi256.rgb = function (args) {
+	args = args[0];
+
+	// Handle greyscale
+	if (args >= 232) {
+		const c = (args - 232) * 10 + 8;
+		return [c, c, c];
+	}
+
+	args -= 16;
+
+	let rem;
+	const r = Math.floor(args / 36) / 5 * 255;
+	const g = Math.floor((rem = args % 36) / 6) / 5 * 255;
+	const b = (rem % 6) / 5 * 255;
+
+	return [r, g, b];
+};
+
+convert.rgb.hex = function (args) {
+	/* eslint-disable no-bitwise */
+	const integer = ((Math.round(args[0]) & 0xFF) << 16)
+		+ ((Math.round(args[1]) & 0xFF) << 8)
+		+ (Math.round(args[2]) & 0xFF);
+	/* eslint-enable no-bitwise */
+
+	const string = integer.toString(16).toUpperCase();
+	return '000000'.slice(string.length) + string;
+};
+
+convert.hex.rgb = function (args) {
+	const match = args.toString(16).match(/[a-f\d]{6}|[a-f\d]{3}/i);
+	if (!match) {
+		return [0, 0, 0];
+	}
+
+	let colorString = match[0];
+
+	if (match[0].length === 3) {
+		colorString = [...colorString].map(char => char + char).join('');
+	}
+
+	const integer = Number.parseInt(colorString, 16);
+	/* eslint-disable no-bitwise */
+	const r = (integer >> 16) & 0xFF;
+	const g = (integer >> 8) & 0xFF;
+	const b = integer & 0xFF;
+	/* eslint-enable no-bitwise */
+
+	return [r, g, b];
+};
+
+convert.rgb.hcg = function (rgb) {
+	const r = rgb[0] / 255;
+	const g = rgb[1] / 255;
+	const b = rgb[2] / 255;
+	const max = Math.max(Math.max(r, g), b);
+	const min = Math.min(Math.min(r, g), b);
+	const chroma = (max - min);
+	let hue;
+
+	const grayscale = chroma < 1 ? min / (1 - chroma) : 0;
+
+	if (chroma <= 0) {
+		hue = 0;
+	} else if (max === r) {
+		hue = ((g - b) / chroma) % 6;
+	} else if (max === g) {
+		hue = 2 + (b - r) / chroma;
+	} else {
+		hue = 4 + (r - g) / chroma;
+	}
+
+	hue /= 6;
+	hue %= 1;
+
+	return [hue * 360, chroma * 100, grayscale * 100];
+};
+
+convert.hsl.hcg = function (hsl) {
+	const s = hsl[1] / 100;
+	const l = hsl[2] / 100;
+
+	const c = l < 0.5 ? (2 * s * l) : (2 * s * (1 - l));
+
+	let f = 0;
+	if (c < 1) {
+		f = (l - 0.5 * c) / (1 - c);
+	}
+
+	return [hsl[0], c * 100, f * 100];
+};
+
+convert.hsv.hcg = function (hsv) {
+	const s = hsv[1] / 100;
+	const v = hsv[2] / 100;
+
+	const c = s * v;
+	let f = 0;
+
+	if (c < 1) {
+		f = (v - c) / (1 - c);
+	}
+
+	return [hsv[0], c * 100, f * 100];
+};
+
+convert.hcg.rgb = function (hcg) {
+	const h = hcg[0] / 360;
+	const c = hcg[1] / 100;
+	const g = hcg[2] / 100;
+
+	if (c === 0) {
+		return [g * 255, g * 255, g * 255];
+	}
+
+	const pure = [0, 0, 0];
+	const hi = (h % 1) * 6;
+	const v = hi % 1;
+	const w = 1 - v;
+	let mg = 0;
+
+	/* eslint-disable max-statements-per-line */
+	switch (Math.floor(hi)) {
+		case 0: {
+			pure[0] = 1; pure[1] = v; pure[2] = 0; break;
+		}
+
+		case 1: {
+			pure[0] = w; pure[1] = 1; pure[2] = 0; break;
+		}
+
+		case 2: {
+			pure[0] = 0; pure[1] = 1; pure[2] = v; break;
+		}
+
+		case 3: {
+			pure[0] = 0; pure[1] = w; pure[2] = 1; break;
+		}
+
+		case 4: {
+			pure[0] = v; pure[1] = 0; pure[2] = 1; break;
+		}
+
+		default: {
+			pure[0] = 1; pure[1] = 0; pure[2] = w;
+		}
+	}
+	/* eslint-enable max-statements-per-line */
+
+	mg = (1 - c) * g;
+
+	return [
+		(c * pure[0] + mg) * 255,
+		(c * pure[1] + mg) * 255,
+		(c * pure[2] + mg) * 255,
+	];
+};
+
+convert.hcg.hsv = function (hcg) {
+	const c = hcg[1] / 100;
+	const g = hcg[2] / 100;
+
+	const v = c + g * (1 - c);
+	let f = 0;
+
+	if (v > 0) {
+		f = c / v;
+	}
+
+	return [hcg[0], f * 100, v * 100];
+};
+
+convert.hcg.hsl = function (hcg) {
+	const c = hcg[1] / 100;
+	const g = hcg[2] / 100;
+
+	const l = g * (1 - c) + 0.5 * c;
+	let s = 0;
+
+	if (l > 0 && l < 0.5) {
+		s = c / (2 * l);
+	} else if (l >= 0.5 && l < 1) {
+		s = c / (2 * (1 - l));
+	}
+
+	return [hcg[0], s * 100, l * 100];
+};
+
+convert.hcg.hwb = function (hcg) {
+	const c = hcg[1] / 100;
+	const g = hcg[2] / 100;
+	const v = c + g * (1 - c);
+	return [hcg[0], (v - c) * 100, (1 - v) * 100];
+};
+
+convert.hwb.hcg = function (hwb) {
+	const w = hwb[1] / 100;
+	const b = hwb[2] / 100;
+	const v = 1 - b;
+	const c = v - w;
+	let g = 0;
+
+	if (c < 1) {
+		g = (v - c) / (1 - c);
+	}
+
+	return [hwb[0], c * 100, g * 100];
+};
+
+convert.apple.rgb = function (apple) {
+	return [(apple[0] / 65_535) * 255, (apple[1] / 65_535) * 255, (apple[2] / 65_535) * 255];
+};
+
+convert.rgb.apple = function (rgb) {
+	return [(rgb[0] / 255) * 65_535, (rgb[1] / 255) * 65_535, (rgb[2] / 255) * 65_535];
+};
+
+convert.gray.rgb = function (args) {
+	return [args[0] / 100 * 255, args[0] / 100 * 255, args[0] / 100 * 255];
+};
+
+convert.gray.hsl = function (args) {
+	return [0, 0, args[0]];
+};
+
+convert.gray.hsv = convert.gray.hsl;
+
+convert.gray.hwb = function (gray) {
+	return [0, 100, gray[0]];
+};
+
+convert.gray.cmyk = function (gray) {
+	return [0, 0, 0, gray[0]];
+};
+
+convert.gray.lab = function (gray) {
+	return [gray[0], 0, 0];
+};
+
+convert.gray.hex = function (gray) {
+	/* eslint-disable no-bitwise */
+	const value = Math.round(gray[0] / 100 * 255) & 0xFF;
+	const integer = (value << 16) + (value << 8) + value;
+	/* eslint-enable no-bitwise */
+
+	const string = integer.toString(16).toUpperCase();
+	return '000000'.slice(string.length) + string;
+};
+
+convert.rgb.gray = function (rgb) {
+	const value = (rgb[0] + rgb[1] + rgb[2]) / 3;
+	return [value / 255 * 100];
+};
--- a/backend/node_modules/color-convert/index.d.ts
+++ b/backend/node_modules/color-convert/index.d.ts
@ -0,0 +1,744 @@
+export type Channels = number;
+export type RGB = [r: number, g: number, b: number];
+export type HSL = [h: number, s: number, l: number];
+export type HSV = [h: number, s: number, v: number];
+export type CMYK = [c: number, m: number, y: number, k: number];
+export type LAB = [l: number, a: number, b: number];
+export type LCH = [l: number, c: number, h: number];
+export type HCG = [h: number, c: number, g: number];
+export type HWB = [h: number, w: number, b: number];
+export type XYZ = [x: number, y: number, z: number];
+export type Apple = [r16: number, g16: number, b16: number];
+export type Gray = [gray: number];
+export type ANSI16 = number;
+export type ANSI256 = number;
+export type Keyword = string;
+export type HEX = string;
+
+declare namespace route {
+	type rgb = {
+		hsl(from: RGB): HSL;
+		hsl(...from: RGB): HSL;
+		hsl(from: RGB): HSL;
+		hsl(...from: RGB): HSL;
+		hsv(from: RGB): HSV;
+		hsv(...from: RGB): HSV;
+		hwb(from: RGB): HWB;
+		hwb(...from: RGB): HWB;
+		cmyk(from: RGB): CMYK;
+		cmyk(...from: RGB): CMYK;
+		xyz(from: RGB): XYZ;
+		xyz(...from: RGB): XYZ;
+		lab(from: RGB): LAB;
+		lab(...from: RGB): LAB;
+		lch(from: RGB): LCH;
+		lch(...from: RGB): LCH;
+		hex(from: RGB): HEX;
+		hex(...from: RGB): HEX;
+		keyword(from: RGB): Keyword;
+		keyword(...from: RGB): Keyword;
+		ansi16(from: RGB): ANSI16;
+		ansi16(...from: RGB): ANSI16;
+		ansi256(from: RGB): ANSI256;
+		ansi256(...from: RGB): ANSI256;
+		hcg(from: RGB): HCG;
+		hcg(...from: RGB): HCG;
+		apple(from: RGB): Apple;
+		apple(...from: RGB): Apple;
+		gray(from: RGB): Gray;
+		gray(...from: RGB): Gray;
+	};
+
+	type hsl = {
+		rgb(from: HSL): RGB;
+		rgb(...from: HSL): RGB;
+		hsv(from: HSL): HSV;
+		hsv(...from: HSL): HSV;
+		hwb(from: HSL): HWB;
+		hwb(...from: HSL): HWB;
+		cmyk(from: HSL): CMYK;
+		cmyk(...from: HSL): CMYK;
+		xyz(from: HSL): XYZ;
+		xyz(...from: HSL): XYZ;
+		lab(from: HSL): LAB;
+		lab(...from: HSL): LAB;
+		lch(from: HSL): LCH;
+		lch(...from: HSL): LCH;
+		hex(from: HSL): HEX;
+		hex(...from: HSL): HEX;
+		keyword(from: HSL): Keyword;
+		keyword(...from: HSL): Keyword;
+		ansi16(from: HSL): ANSI16;
+		ansi16(...from: HSL): ANSI16;
+		ansi256(from: HSL): ANSI256;
+		ansi256(...from: HSL): ANSI256;
+		hcg(from: HSL): HCG;
+		hcg(...from: HSL): HCG;
+		apple(from: HSL): Apple;
+		apple(...from: HSL): Apple;
+		gray(from: HSL): Gray;
+		gray(...from: HSL): Gray;
+	};
+
+	type hsv = {
+		rgb(from: HSV): RGB;
+		rgb(...from: HSV): RGB;
+		hsl(from: HSV): HSL;
+		hsl(...from: HSV): HSL;
+		hwb(from: HSV): HWB;
+		hwb(...from: HSV): HWB;
+		cmyk(from: HSV): CMYK;
+		cmyk(...from: HSV): CMYK;
+		xyz(from: HSV): XYZ;
+		xyz(...from: HSV): XYZ;
+		lab(from: HSV): LAB;
+		lab(...from: HSV): LAB;
+		lch(from: HSV): LCH;
+		lch(...from: HSV): LCH;
+		hex(from: HSV): HEX;
+		hex(...from: HSV): HEX;
+		keyword(from: HSV): Keyword;
+		keyword(...from: HSV): Keyword;
+		ansi16(from: HSV): ANSI16;
+		ansi16(...from: HSV): ANSI16;
+		ansi256(from: HSV): ANSI256;
+		ansi256(...from: HSV): ANSI256;
+		hcg(from: HSV): HCG;
+		hcg(...from: HSV): HCG;
+		apple(from: HSV): Apple;
+		apple(...from: HSV): Apple;
+		gray(from: HSV): Gray;
+		gray(...from: HSV): Gray;
+	};
+
+	type hwb = {
+		rgb(from: HWB): RGB;
+		rgb(...from: HWB): RGB;
+		hsl(from: HWB): HSL;
+		hsl(...from: HWB): HSL;
+		hsv(from: HWB): HSV;
+		hsv(...from: HWB): HSV;
+		cmyk(from: HWB): CMYK;
+		cmyk(...from: HWB): CMYK;
+		xyz(from: HWB): XYZ;
+		xyz(...from: HWB): XYZ;
+		lab(from: HWB): LAB;
+		lab(...from: HWB): LAB;
+		lch(from: HWB): LCH;
+		lch(...from: HWB): LCH;
+		hex(from: HWB): HEX;
+		hex(...from: HWB): HEX;
+		keyword(from: HWB): Keyword;
+		keyword(...from: HWB): Keyword;
+		ansi16(from: HWB): ANSI16;
+		ansi16(...from: HWB): ANSI16;
+		ansi256(from: HWB): ANSI256;
+		ansi256(...from: HWB): ANSI256;
+		hcg(from: HWB): HCG;
+		hcg(...from: HWB): HCG;
+		apple(from: HWB): Apple;
+		apple(...from: HWB): Apple;
+		gray(from: HWB): Gray;
+		gray(...from: HWB): Gray;
+
+	};
+
+	type cmyk = {
+		rgb(from: CMYK): RGB;
+		rgb(...from: CMYK): RGB;
+		hsl(from: CMYK): HSL;
+		hsl(...from: CMYK): HSL;
+		hsv(from: CMYK): HSV;
+		hsv(...from: CMYK): HSV;
+		hwb(from: CMYK): HWB;
+		hwb(...from: CMYK): HWB;
+		xyz(from: CMYK): XYZ;
+		xyz(...from: CMYK): XYZ;
+		lab(from: CMYK): LAB;
+		lab(...from: CMYK): LAB;
+		lch(from: CMYK): LCH;
+		lch(...from: CMYK): LCH;
+		hex(from: CMYK): HEX;
+		hex(...from: CMYK): HEX;
+		keyword(from: CMYK): Keyword;
+		keyword(...from: CMYK): Keyword;
+		ansi16(from: CMYK): ANSI16;
+		ansi16(...from: CMYK): ANSI16;
+		ansi256(from: CMYK): ANSI256;
+		ansi256(...from: CMYK): ANSI256;
+		hcg(from: CMYK): HCG;
+		hcg(...from: CMYK): HCG;
+		apple(from: CMYK): Apple;
+		apple(...from: CMYK): Apple;
+		gray(from: CMYK): Gray;
+		gray(...from: CMYK): Gray;
+	};
+
+	type xyz = {
+		rgb(from: XYZ): RGB;
+		rgb(...from: XYZ): RGB;
+		hsl(from: XYZ): HSL;
+		hsl(...from: XYZ): HSL;
+		hsv(from: XYZ): HSV;
+		hsv(...from: XYZ): HSV;
+		hwb(from: XYZ): HWB;
+		hwb(...from: XYZ): HWB;
+		cmyk(from: XYZ): CMYK;
+		cmyk(...from: XYZ): CMYK;
+		lab(from: XYZ): LAB;
+		lab(...from: XYZ): LAB;
+		lch(from: XYZ): LCH;
+		lch(...from: XYZ): LCH;
+		hex(from: XYZ): HEX;
+		hex(...from: XYZ): HEX;
+		keyword(from: XYZ): Keyword;
+		keyword(...from: XYZ): Keyword;
+		ansi16(from: XYZ): ANSI16;
+		ansi16(...from: XYZ): ANSI16;
+		ansi256(from: XYZ): ANSI256;
+		ansi256(...from: XYZ): ANSI256;
+		hcg(from: XYZ): HCG;
+		hcg(...from: XYZ): HCG;
+		apple(from: XYZ): Apple;
+		apple(...from: XYZ): Apple;
+		gray(from: XYZ): Gray;
+		gray(...from: XYZ): Gray;
+	};
+
+	type lab = {
+		rgb(from: LAB): RGB;
+		rgb(...from: LAB): RGB;
+		hsl(from: LAB): HSL;
+		hsl(...from: LAB): HSL;
+		hsv(from: LAB): HSV;
+		hsv(...from: LAB): HSV;
+		hwb(from: LAB): HWB;
+		hwb(...from: LAB): HWB;
+		cmyk(from: LAB): CMYK;
+		cmyk(...from: LAB): CMYK;
+		xyz(from: LAB): XYZ;
+		xyz(...from: LAB): XYZ;
+		lch(from: LAB): LCH;
+		lch(...from: LAB): LCH;
+		hex(from: LAB): HEX;
+		hex(...from: LAB): HEX;
+		keyword(from: LAB): Keyword;
+		keyword(...from: LAB): Keyword;
+		ansi16(from: LAB): ANSI16;
+		ansi16(...from: LAB): ANSI16;
+		ansi256(from: LAB): ANSI256;
+		ansi256(...from: LAB): ANSI256;
+		hcg(from: LAB): HCG;
+		hcg(...from: LAB): HCG;
+		apple(from: LAB): Apple;
+		apple(...from: LAB): Apple;
+		gray(from: LAB): Gray;
+		gray(...from: LAB): Gray;
+	};
+
+	type lch = {
+		rgb(from: LCH): RGB;
+		rgb(...from: LCH): RGB;
+		hsl(from: LCH): HSL;
+		hsl(...from: LCH): HSL;
+		hsv(from: LCH): HSV;
+		hsv(...from: LCH): HSV;
+		hwb(from: LCH): HWB;
+		hwb(...from: LCH): HWB;
+		cmyk(from: LCH): CMYK;
+		cmyk(...from: LCH): CMYK;
+		xyz(from: LCH): XYZ;
+		xyz(...from: LCH): XYZ;
+		lab(from: LCH): LAB;
+		lab(...from: LCH): LAB;
+		hex(from: LCH): HEX;
+		hex(...from: LCH): HEX;
+		keyword(from: LCH): Keyword;
+		keyword(...from: LCH): Keyword;
+		ansi16(from: LCH): ANSI16;
+		ansi16(...from: LCH): ANSI16;
+		ansi256(from: LCH): ANSI256;
+		ansi256(...from: LCH): ANSI256;
+		hcg(from: LCH): HCG;
+		hcg(...from: LCH): HCG;
+		apple(from: LCH): Apple;
+		apple(...from: LCH): Apple;
+		gray(from: LCH): Gray;
+		gray(...from: LCH): Gray;
+	};
+
+	type hex = {
+		rgb(from: HEX): RGB;
+		hsl(from: HEX): HSL;
+		hsv(from: HEX): HSV;
+		hwb(from: HEX): HWB;
+		cmyk(from: HEX): CMYK;
+		xyz(from: HEX): XYZ;
+		lab(from: HEX): LAB;
+		lch(from: HEX): LCH;
+		keyword(from: HEX): Keyword;
+		ansi16(from: HEX): ANSI16;
+		ansi256(from: HEX): ANSI256;
+		hcg(from: HEX): HCG;
+		apple(from: HEX): Apple;
+		gray(from: HEX): Gray;
+	};
+
+	type keyword = {
+		rgb(from: Keyword): RGB;
+		hsl(from: Keyword): HSL;
+		hsv(from: Keyword): HSV;
+		hwb(from: Keyword): HWB;
+		cmyk(from: Keyword): CMYK;
+		xyz(from: Keyword): XYZ;
+		lab(from: Keyword): LAB;
+		lch(from: Keyword): LCH;
+		hex(from: Keyword): HEX;
+		ansi16(from: Keyword): ANSI16;
+		ansi256(from: Keyword): ANSI256;
+		hcg(from: Keyword): HCG;
+		apple(from: Keyword): Apple;
+		gray(from: Keyword): Gray;
+	};
+
+	type ansi16 = {
+		rgb(from: ANSI16): RGB;
+		hsl(from: ANSI16): HSL;
+		hsv(from: ANSI16): HSV;
+		hwb(from: ANSI16): HWB;
+		cmyk(from: ANSI16): CMYK;
+		xyz(from: ANSI16): XYZ;
+		lab(from: ANSI16): LAB;
+		lch(from: ANSI16): LCH;
+		hex(from: ANSI16): HEX;
+		keyword(from: ANSI16): Keyword;
+		ansi256(from: ANSI16): ANSI256;
+		hcg(from: ANSI16): HCG;
+		apple(from: ANSI16): Apple;
+		gray(from: ANSI16): Gray;
+	};
+
+	type ansi256 = {
+		rgb(from: ANSI256): RGB;
+		hsl(from: ANSI256): HSL;
+		hsv(from: ANSI256): HSV;
+		hwb(from: ANSI256): HWB;
+		cmyk(from: ANSI256): CMYK;
+		xyz(from: ANSI256): XYZ;
+		lab(from: ANSI256): LAB;
+		lch(from: ANSI256): LCH;
+		hex(from: ANSI256): HEX;
+		keyword(from: ANSI256): Keyword;
+		ansi16(from: ANSI256): ANSI16;
+		hcg(from: ANSI256): HCG;
+		apple(from: ANSI256): Apple;
+		gray(from: ANSI256): Gray;
+	};
+
+	type hcg = {
+		rgb(from: HCG): RGB;
+		rgb(...from: HCG): RGB;
+		hsl(from: HCG): HSL;
+		hsl(...from: HCG): HSL;
+		hsv(from: HCG): HSV;
+		hsv(...from: HCG): HSV;
+		hwb(from: HCG): HWB;
+		hwb(...from: HCG): HWB;
+		cmyk(from: HCG): CMYK;
+		cmyk(...from: HCG): CMYK;
+		xyz(from: HCG): XYZ;
+		xyz(...from: HCG): XYZ;
+		lab(from: HCG): LAB;
+		lab(...from: HCG): LAB;
+		lch(from: HCG): LCH;
+		lch(...from: HCG): LCH;
+		hex(from: HCG): HEX;
+		hex(...from: HCG): HEX;
+		keyword(from: HCG): Keyword;
+		keyword(...from: HCG): Keyword;
+		ansi16(from: HCG): ANSI16;
+		ansi16(...from: HCG): ANSI16;
+		ansi256(from: HCG): ANSI256;
+		ansi256(...from: HCG): ANSI256;
+		apple(from: HCG): Apple;
+		apple(...from: HCG): Apple;
+		gray(from: HCG): Gray;
+		gray(...from: HCG): Gray;
+
+	};
+
+	type apple = {
+		rgb(from: Apple): RGB;
+		rgb(...from: Apple): RGB;
+		hsl(from: Apple): HSL;
+		hsl(...from: Apple): HSL;
+		hsv(from: Apple): HSV;
+		hsv(...from: Apple): HSV;
+		hwb(from: Apple): HWB;
+		hwb(...from: Apple): HWB;
+		cmyk(from: Apple): CMYK;
+		cmyk(...from: Apple): CMYK;
+		xyz(from: Apple): XYZ;
+		xyz(...from: Apple): XYZ;
+		lab(from: Apple): LAB;
+		lab(...from: Apple): LAB;
+		lch(from: Apple): LCH;
+		lch(...from: Apple): LCH;
+		hex(from: Apple): HEX;
+		hex(...from: Apple): HEX;
+		keyword(from: Apple): Keyword;
+		keyword(...from: Apple): Keyword;
+		ansi16(from: Apple): ANSI16;
+		ansi16(...from: Apple): ANSI16;
+		ansi256(from: Apple): ANSI256;
+		ansi256(...from: Apple): ANSI256;
+		hcg(from: Apple): HCG;
+		hcg(...from: Apple): HCG;
+		gray(from: Apple): Gray;
+		gray(...from: Apple): Gray;
+	};
+
+	type gray = {
+		rgb(from: Gray): RGB;
+		rgb(...from: Gray): RGB;
+		hsl(from: Gray): HSL;
+		hsl(...from: Gray): HSL;
+		hsv(from: Gray): HSV;
+		hsv(...from: Gray): HSV;
+		hwb(from: Gray): HWB;
+		hwb(...from: Gray): HWB;
+		cmyk(from: Gray): CMYK;
+		cmyk(...from: Gray): CMYK;
+		xyz(from: Gray): XYZ;
+		xyz(...from: Gray): XYZ;
+		lab(from: Gray): LAB;
+		lab(...from: Gray): LAB;
+		lch(from: Gray): LCH;
+		lch(...from: Gray): LCH;
+		hex(from: Gray): HEX;
+		hex(...from: Gray): HEX;
+		keyword(from: Gray): Keyword;
+		keyword(...from: Gray): Keyword;
+		ansi16(from: Gray): ANSI16;
+		ansi16(...from: Gray): ANSI16;
+		ansi256(from: Gray): ANSI256;
+		ansi256(...from: Gray): ANSI256;
+		hcg(from: Gray): HCG;
+		hcg(...from: Gray): HCG;
+		apple(from: Gray): Apple;
+		apple(...from: Gray): Apple;
+	};
+}
+
+declare function route(fromModel: 'rgb'): route.rgb;
+declare function route(fromModel: 'hsl'): route.hsl;
+declare function route(fromModel: 'hsv'): route.hsv;
+declare function route(fromModel: 'hwb'): route.hwb;
+declare function route(fromModel: 'cmyk'): route.cmyk;
+declare function route(fromModel: 'xyz'): route.xyz;
+declare function route(fromModel: 'lab'): route.lab;
+declare function route(fromModel: 'lch'): route.lch;
+declare function route(fromModel: 'hex'): route.hex;
+declare function route(fromModel: 'keyword'): route.keyword;
+declare function route(fromModel: 'ansi16'): route.ansi16;
+declare function route(fromModel: 'ansi256'): route.ansi256;
+declare function route(fromModel: 'hcg'): route.hcg;
+declare function route(fromModel: 'apple'): route.apple;
+declare function route(fromModel: 'gray'): route.gray;
+
+export type Convert = {
+	rgb: {
+		channels: Channels;
+		labels: 'rgb';
+		hsl: {
+			(...rgb: RGB): HSL;
+			raw: (...rgb: RGB) => HSL;
+		};
+		hsv: {
+			(...rgb: RGB): HSV;
+			raw: (...rgb: RGB) => HSV;
+		};
+		hwb: {
+			(...rgb: RGB): HWB;
+			raw: (...rgb: RGB) => HWB;
+		};
+		hcg: {
+			(...rgb: RGB): HCG;
+			raw: (...rgb: RGB) => HCG;
+		};
+		cmyk: {
+			(...rgb: RGB): CMYK;
+			raw: (...rgb: RGB) => CMYK;
+		};
+		keyword: {
+			(...rgb: RGB): Keyword;
+			raw: (...rgb: RGB) => Keyword;
+		};
+		ansi16: {
+			(...rgb: RGB): ANSI16;
+			raw: (...rgb: RGB) => ANSI16;
+		};
+		ansi256: {
+			(...rgb: RGB): ANSI256;
+			raw: (...rgb: RGB) => ANSI256;
+		};
+		apple: {
+			(...rgb: RGB): Apple;
+			raw: (...rgb: RGB) => Apple;
+		};
+		hex: {
+			(...rgb: RGB): HEX;
+			raw: (...rgb: RGB) => HEX;
+		};
+		gray: {
+			(...rgb: RGB): Gray;
+			raw: (...rgb: RGB) => Gray;
+		};
+	} & route.rgb & {
+		[F in keyof route.rgb]: {
+			raw: route.rgb[F];
+		};
+	};
+	keyword: {
+		channels: Channels;
+		rgb: {
+			(keyword: Keyword): RGB;
+			raw: (keyword: Keyword) => RGB;
+		};
+	} & route.keyword & {
+		[F in keyof route.keyword]: {
+			raw: route.keyword[F];
+		};
+	};
+	hsl: {
+		channels: Channels;
+		labels: 'hsl';
+		rgb: {
+			(...hsl: HSL): RGB;
+			raw: (...hsl: HSL) => RGB;
+		};
+		hsv: {
+			(...hsl: HSL): HSV;
+			raw: (...hsl: HSL) => HSV;
+		};
+		hcg: {
+			(...hsl: HSL): HCG;
+			raw: (...hsl: HSL) => HCG;
+		};
+	} & route.hsl & {
+		[F in keyof route.hsl]: {
+			raw: route.hsl[F];
+		};
+	};
+	hsv: {
+		channels: Channels;
+		labels: 'hsv';
+		hcg: {
+			(...hsv: HSV): HCG;
+			raw: (...hsv: HSV) => HCG;
+		};
+		rgb: {
+			(...hsv: HSV): RGB;
+			raw: (...hsv: HSV) => RGB;
+		};
+		hsv: {
+			(...hsv: HSV): HSV;
+			raw: (...hsv: HSV) => HSV;
+		};
+		hsl: {
+			(...hsv: HSV): HSL;
+			raw: (...hsv: HSV) => HSL;
+		};
+		hwb: {
+			(...hsv: HSV): HWB;
+			raw: (...hsv: HSV) => HWB;
+		};
+		ansi16: {
+			(...hsv: HSV): ANSI16;
+			raw: (...hsv: HSV) => ANSI16;
+		};
+	} & route.hsv & {
+		[F in keyof route.hsv]: {
+			raw: route.hsv[F];
+		};
+	};
+	hwb: {
+		channels: Channels;
+		labels: 'hwb';
+		hcg: {
+			(...hwb: HWB): HCG;
+			raw: (...hwb: HWB) => HCG;
+		};
+		rgb: {
+			(...hwb: HWB): RGB;
+			raw: (...hwb: HWB) => RGB;
+		};
+	} & route.hwb & {
+		[F in keyof route.hwb]: {
+			raw: route.hwb[F];
+		};
+	};
+	cmyk: {
+		channels: Channels;
+		labels: 'cmyk';
+		rgb: {
+			(...cmyk: CMYK): RGB;
+			raw: (...cmyk: CMYK) => RGB;
+		};
+	} & route.cmyk & {
+		[F in keyof route.cmyk]: {
+			raw: route.cmyk[F];
+		};
+	};
+	xyz: {
+		channels: Channels;
+		labels: 'xyz';
+		rgb: {
+			(...xyz: XYZ): RGB;
+			raw: (...xyz: XYZ) => RGB;
+		};
+		lab: {
+			(...xyz: XYZ): LAB;
+			raw: (...xyz: XYZ) => LAB;
+		};
+	} & route.xyz & {
+		[F in keyof route.xyz]: {
+			raw: route.xyz[F];
+		};
+	};
+	lab: {
+		channels: Channels;
+		labels: 'lab';
+		xyz: {
+			(...lab: LAB): XYZ;
+			raw: (...lab: LAB) => XYZ;
+		};
+		lch: {
+			(...lab: LAB): LCH;
+			raw: (...lab: LAB) => LCH;
+		};
+	} & route.lab & {
+		[F in keyof route.lab]: {
+			raw: route.lab[F];
+		};
+	};
+	lch: {
+		channels: Channels;
+		labels: 'lch';
+		lab: {
+			(...lch: LCH): LAB;
+			raw: (...lch: LCH) => LAB;
+		};
+	} & route.lch & {
+		[F in keyof route.lch]: {
+			raw: route.lch[F];
+		};
+	};
+	hex: {
+		channels: Channels;
+		labels: ['hex'];
+		rgb: {
+			(hex: HEX): RGB;
+			raw: (hex: HEX) => RGB;
+		};
+	} & route.hex & {
+		[F in keyof route.hex]: {
+			raw: route.hex[F];
+		};
+	};
+	ansi16: {
+		channels: Channels;
+		labels: ['ansi16'];
+		rgb: {
+			(ansi16: ANSI16): RGB;
+			raw: (ansi16: ANSI16) => RGB;
+		};
+	} & route.ansi16 & {
+		[F in keyof route.ansi16]: {
+			raw: route.ansi16[F];
+		};
+	};
+	ansi256: {
+		channels: Channels;
+		labels: ['ansi256'];
+		rgb: {
+			(ansi256: ANSI256): RGB;
+			raw: (ansi256: ANSI256) => RGB;
+		};
+	} & route.ansi256 & {
+		[F in keyof route.ansi256]: {
+			raw: route.ansi256[F];
+		};
+	};
+	hcg: {
+		channels: Channels;
+		labels: ['h', 'c', 'g'];
+		rgb: {
+			(...hcg: HCG): RGB;
+			raw: (...hcg: HCG) => RGB;
+		};
+		hsv: {
+			(...hcg: HCG): HSV;
+			raw: (...hcg: HCG) => HSV;
+		};
+		hwb: {
+			(...hcg: HCG): HWB;
+			raw: (...hcg: HCG) => HWB;
+		};
+	} & route.hcg & {
+		[F in keyof route.hcg]: {
+			raw: route.hcg[F];
+		};
+	};
+	apple: {
+		channels: Channels;
+		labels: ['r16', 'g16', 'b16'];
+		rgb: {
+			(...apple: Apple): RGB;
+			raw: (...apple: Apple) => RGB;
+		};
+	} & route.apple & {
+		[F in keyof route.apple]: {
+			raw: route.apple[F];
+		};
+	};
+	gray: {
+		channels: Channels;
+		labels: ['gray'];
+		rgb: {
+			(...gray: Gray): RGB;
+			raw: (...gray: Gray) => RGB;
+		};
+		hsl: {
+			(...gray: Gray): HSL;
+			raw: (...gray: Gray) => HSL;
+		};
+		hsv: {
+			(...gray: Gray): HSV;
+			raw: (...gray: Gray) => HSV;
+		};
+		hwb: {
+			(...gray: Gray): HWB;
+			raw: (...gray: Gray) => HWB;
+		};
+		cmyk: {
+			(...gray: Gray): CMYK;
+			raw: (...gray: Gray) => CMYK;
+		};
+		lab: {
+			(...gray: Gray): LAB;
+			raw: (...gray: Gray) => LAB;
+		};
+		hex: {
+			(...gray: Gray): HEX;
+			raw: (...gray: Gray) => HEX;
+		};
+	} & route.gray & {
+		[F in keyof route.gray]: {
+			raw: route.gray[F];
+		};
+	};
+};
+
+declare const convert: Convert;
+export default convert;
--- a/backend/node_modules/color-convert/index.js
+++ b/backend/node_modules/color-convert/index.js
@ -0,0 +1,81 @@
+import conversions from './conversions.js';
+import route from './route.js';
+
+const convert = {};
+
+const models = Object.keys(conversions);
+
+function wrapRaw(fn) {
+	const wrappedFn = function (...args) {
+		const arg0 = args[0];
+		if (arg0 === undefined || arg0 === null) {
+			return arg0;
+		}
+
+		if (arg0.length > 1) {
+			args = arg0;
+		}
+
+		return fn(args);
+	};
+
+	// Preserve .conversion property if there is one
+	if ('conversion' in fn) {
+		wrappedFn.conversion = fn.conversion;
+	}
+
+	return wrappedFn;
+}
+
+function wrapRounded(fn) {
+	const wrappedFn = function (...args) {
+		const arg0 = args[0];
+
+		if (arg0 === undefined || arg0 === null) {
+			return arg0;
+		}
+
+		if (arg0.length > 1) {
+			args = arg0;
+		}
+
+		const result = fn(args);
+
+		// We're assuming the result is an array here.
+		// see notice in conversions.js; don't use box types
+		// in conversion functions.
+		if (typeof result === 'object') {
+			for (let {length} = result, i = 0; i < length; i++) {
+				result[i] = Math.round(result[i]);
+			}
+		}
+
+		return result;
+	};
+
+	// Preserve .conversion property if there is one
+	if ('conversion' in fn) {
+		wrappedFn.conversion = fn.conversion;
+	}
+
+	return wrappedFn;
+}
+
+for (const fromModel of models) {
+	convert[fromModel] = {};
+
+	Object.defineProperty(convert[fromModel], 'channels', {value: conversions[fromModel].channels});
+	Object.defineProperty(convert[fromModel], 'labels', {value: conversions[fromModel].labels});
+
+	const routes = route(fromModel);
+	const routeModels = Object.keys(routes);
+
+	for (const toModel of routeModels) {
+		const fn = routes[toModel];
+
+		convert[fromModel][toModel] = wrapRounded(fn);
+		convert[fromModel][toModel].raw = wrapRaw(fn);
+	}
+}
+
+export default convert;
--- a/backend/node_modules/color-convert/package.json
+++ b/backend/node_modules/color-convert/package.json
@ -0,0 +1,58 @@
+{
+  "name": "color-convert",
+  "description": "Plain color conversion functions",
+  "version": "3.1.3",
+  "author": "Josh Junon <josh@junon.me>",
+  "contributors": [
+    "Heather Arthur <fayearthur@gmail.com>"
+  ],
+  "license": "MIT",
+  "repository": "Qix-/color-convert",
+  "type": "module",
+  "exports": "./index.js",
+  "types": "./index.d.ts",
+  "engines": {
+    "node": ">=14.6"
+  },
+  "scripts": {
+    "test": "xo && tsd && node test/basic.js"
+  },
+  "files": [
+    "index.js",
+    "index.d.ts",
+    "conversions.js",
+    "route.js"
+  ],
+  "keywords": [
+    "color",
+    "colour",
+    "convert",
+    "converter",
+    "conversion",
+    "rgb",
+    "hsl",
+    "hsv",
+    "hwb",
+    "cmyk",
+    "ansi",
+    "ansi16"
+  ],
+  "xo": {
+    "rules": {
+      "default-case": 0,
+      "no-inline-comments": 0,
+      "operator-linebreak": 0,
+      "unicorn/prefer-exponentiation-operator": 0,
+      "@typescript-eslint/naming-convention": 0
+    }
+  },
+  "devDependencies": {
+    "chalk": "^5.2.0",
+    "jimp": "^0.22.8",
+    "tsd": "^0.28.1",
+    "xo": "^0.54.2"
+  },
+  "dependencies": {
+    "color-name": "^2.0.0"
+  }
+}
--- a/backend/node_modules/color-convert/route.js
+++ b/backend/node_modules/color-convert/route.js
@ -0,0 +1,98 @@
+import conversions from './conversions.js';
+
+/*
+	This function routes a model to all other models.
+
+	all functions that are routed have a property `.conversion` attached
+	to the returned synthetic function. This property is an array
+	of strings, each with the steps in between the 'from' and 'to'
+	color models (inclusive).
+
+	conversions that are not possible simply are not included.
+*/
+
+function buildGraph() {
+	const graph = {};
+	// https://jsperf.com/object-keys-vs-for-in-with-closure/3
+	const models = Object.keys(conversions);
+
+	for (let {length} = models, i = 0; i < length; i++) {
+		graph[models[i]] = {
+			// http://jsperf.com/1-vs-infinity
+			// micro-opt, but this is simple.
+			distance: -1,
+			parent: null,
+		};
+	}
+
+	return graph;
+}
+
+// https://en.wikipedia.org/wiki/Breadth-first_search
+function deriveBFS(fromModel) {
+	const graph = buildGraph();
+	const queue = [fromModel]; // Unshift -> queue -> pop
+
+	graph[fromModel].distance = 0;
+
+	while (queue.length > 0) {
+		const current = queue.pop();
+		const adjacents = Object.keys(conversions[current]);
+
+		for (let {length} = adjacents, i = 0; i < length; i++) {
+			const adjacent = adjacents[i];
+			const node = graph[adjacent];
+
+			if (node.distance === -1) {
+				node.distance = graph[current].distance + 1;
+				node.parent = current;
+				queue.unshift(adjacent);
+			}
+		}
+	}
+
+	return graph;
+}
+
+function link(from, to) {
+	return function (args) {
+		return to(from(args));
+	};
+}
+
+function wrapConversion(toModel, graph) {
+	const path = [graph[toModel].parent, toModel];
+	let fn = conversions[graph[toModel].parent][toModel];
+
+	let cur = graph[toModel].parent;
+	while (graph[cur].parent) {
+		path.unshift(graph[cur].parent);
+		fn = link(conversions[graph[cur].parent][cur], fn);
+		cur = graph[cur].parent;
+	}
+
+	fn.conversion = path;
+	return fn;
+}
+
+function route(fromModel) {
+	const graph = deriveBFS(fromModel);
+	const conversion = {};
+
+	const models = Object.keys(graph);
+	for (let {length} = models, i = 0; i < length; i++) {
+		const toModel = models[i];
+		const node = graph[toModel];
+
+		if (node.parent === null) {
+			// No possible conversion, or this node is the source model.
+			continue;
+		}
+
+		conversion[toModel] = wrapConversion(toModel, graph);
+	}
+
+	return conversion;
+}
+
+export default route;