@peculiar/color
Version:
Library for color manipulation and conversion in JavaScript.
77 lines • 2.85 kB
JavaScript
import { hexToRgb } from './hex_to_rgb';
import { rgbToHsb } from './rgb_to_hsb';
import { rgbToHex } from './rgb_to_hex';
import { hsbToRgb } from './hsb_to_rgb';
import { getContrastRatio } from './get_contrast_ratio';
var Color = /** @class */ (function () {
function Color(color) {
this.saturationMinMax = [10, 30];
this.brightnessMinMax = [15, 100];
var _a = typeof color === 'string' ? hexToRgb(color) : color, r = _a[0], g = _a[1], b = _a[2];
this.red = r;
this.green = g;
this.blue = b;
}
Color.prototype.toHex = function () {
return rgbToHex(this.red, this.green, this.blue);
};
Color.prototype.toHexString = function () {
return "#".concat(this.toHex());
};
Color.prototype.toRgb = function () {
return [this.red, this.green, this.blue];
};
Color.prototype.toRgbString = function () {
return "rgb(".concat(this.toRgb().join(', '), ")");
};
Color.prototype.toHsb = function () {
return rgbToHsb(this.red, this.green, this.blue);
};
Color.prototype.palette = function () {
var _a = this.toHsb(), h = _a[0], s = _a[1], b = _a[2];
var steps = 5;
var saturationTintStep = (s - this.saturationMinMax[0]) / steps;
var saturationShadeStep = (s - this.saturationMinMax[1]) / steps;
var brightnessTintStep = (this.brightnessMinMax[1] - b) / steps;
var brightnessShadeStep = (b - this.brightnessMinMax[0]) / steps;
if (brightnessTintStep < 0) {
brightnessTintStep = 0;
}
if (brightnessShadeStep < 0) {
brightnessShadeStep = 0;
}
if (saturationTintStep < 0) {
saturationTintStep = 0;
}
if (saturationShadeStep < 0) {
saturationShadeStep = 0;
}
var tints = [];
var shades = [];
for (var i = 1; i <= steps; i += 1) {
var tintRgb = hsbToRgb(h, Math.floor(s - saturationTintStep * i), Math.floor(b + brightnessTintStep * i));
var shadeRgb = hsbToRgb(h, Math.floor(s - saturationShadeStep * i), Math.floor(b - brightnessShadeStep * i));
tints.push(new Color(tintRgb));
shades.push(new Color(shadeRgb));
}
return {
tint5: tints[4],
tint4: tints[3],
tint3: tints[2],
tint2: tints[1],
tint1: tints[0],
base: this,
shade1: shades[0],
shade2: shades[1],
shade3: shades[2],
shade4: shades[3],
shade5: shades[4],
};
};
Color.prototype.getContrastRatio = function (color) {
return getContrastRatio([this.red, this.green, this.blue], color);
};
return Color;
}());
export { Color };
//# sourceMappingURL=color.js.map