Newfangled Package Modernizer
Wondering what’s next for npm?Check out our public roadmap! »

color-interfaces
TypeScript icon, indicating that this package has built-in type declarations

0.1.25 • Public • Published

color-interfaces

Coverage Status Install Size MIT License

Basic Usage

> const color = createColor();
> color.rgb.r = 200;
< 200
 
> color.hsl.toCss()
< "hsl(0, 100%, 39%)"
 
> color.rgb.toCss()
< "rgb(200, 0, 0)"
 
> color.hex.toCss()
< "#c80000"
 
> createColor('rgb(22, 35, 234)').rgb.get()
< [22, 35, 234]
 
> createColor('rgba(22, 35, 234, 0.7)').rgba.get()
< [22, 35, 234, 0.7]
 
> createColor('hsl(310, 85%, 65%)').hsl.get()
< [310, 0.85, 0.65]
 
> createColor('hsla(310, 85%, 65%, 0.45)').hsla.get()
< [310, 0.85, 0.65, 0.45]
 
> createColor('lime').rgb.get()
< [0, 255, 0]

Example

color tool

Interfaces

export interface Color {
  rgb: RGBInterface;
  rgba: RGBAInterface;
  hsl: HSLInterface;
  hsla: HSLAInterface;
  hsv: HSVInterface;
  hsva: HSVAInterface;
  hex: HexInterface;
  hexa: HexAInterface;
  alpha: number;
  getRed(): number;
  setRed(red: number): void;
  getGreen(): number;
  setGreen(green: number): void;
  getBlue(): number;
  setBlue(blue: number): void;
  getHue(): number;
  setHue(hue: number): void;
  getSaturation(): number;
  setSaturation(saturation: number): void;
  getLightness(): number;
  setLightness(lightness: number): void;
  getSaturationV(): number;
  setSaturationV(saturationV: number): void;
  getValue(): number;
  setValue(value: number): void;
  getContrastRatio(color2: Color): number;
  getGreyValue(): number;
  getLuminance(): number;
  invert(): this;
  parseCSSColor(input: string): void;
  copy: () => Color;
  mixWithColor(color: Color, percent: number): Color;
}
 
export interface RGBInterface {
  r: number;
  g: number;
  b: number;
  get: () => RGB;
  set: (rgb: RGB) => RGBInterface;
  toCss: () => string;
}
 
export interface RGBAInterface {
  r: number;
  g: number;
  b: number;
  a: number;
  get: () => RGBA;
  set: (rgba: RGBA) => RGBAInterface;
  toCss: () => string;
}
 
export interface HSLInterface {
  h: number;
  s: number;
  l: number;
  get: () => HSL;
  set: (hsv: HSL) => HSLInterface;
  toCss: () => string;
}
 
export interface HSLAInterface {
  h: number;
  s: number;
  l: number;
  a: number;
  get: () => HSLA;
  set: (hsva: HSLA) => HSLAInterface;
  toCss: () => string;
}
 
export interface HSVInterface {
  h: number;
  s: number;
  v: number;
  get: () => HSV;
  set: (hsv: HSV) => HSVInterface;
  toCss: () => string;
}
 
export interface HSVAInterface {
  h: number;
  s: number;
  v: number;
  a: number;
  get: () => HSVA;
  set: (hsv: HSVA) => HSVAInterface;
  toCss: () => string;
}
 
export interface HexInterface {
  get: () => HEX;
  set: (hex: HEX) => HexInterface;
  toCss: () => string;
}
 
export interface HexAInterface {
  a: number;
  get: () => HEXA;
  set: (hexa: HEXA) => HexAInterface;
  toCss: () => string;
}
 
export type RGB = [number, number, number];
export type RGBA = [number, number, number, number];
export type HSL = [number, number, number];
export type HSLA = [number, number, number, number];
export type HSV = [number, number, number];
export type HSVA = [number, number, number, number];
export type HEX = string;
export type HEXA = string;
 
 

Install

npm i color-interfaces

DownloadsWeekly Downloads

1

Version

0.1.25

License

MIT

Unpacked Size

49.5 kB

Total Files

22

Last publish

Collaborators

  • avatar