Color Class

Static utility helper class for working with colors.

Since v2.0.0

Example

import { Color } from 'vue-mdbootstrap';

const result = Color.rgbaToString({r: 102, g: 132, b: 145, a: 0.45});
// result: rgba(102, 132, 145, 0.45)

hslaToHsva

class Color {
  static hslaToHsva(color: HSLA): HSVA; 
}

Convert HSLA to HSVA and returns HSVA color value.

Details:

• color: The HSLA color value

hslaToString

class Color {
  static hslaToString(color: HSLA): string; 
}

Convert HSL/HSLA color to string and returns CSS color string.

Details:

• color: The HSLA color value

hsvaToHsla

class Color {
  static hsvaToHsla(color: HSVA): HSLA; 
}

Convert HSVA to HSLA and returns HSLA color value.

Details:

• color: The HSVA color value

hsvaToRgba

class Color {
  static hsvaToRgba(color: HSVA): RGBA; 
}

Convert HSVA to RGBA and returns RGBA color value.

Details:

• color: The HSVA color value

hexToRgba

class Color {
  static hexToRgba(color: string): RGBA; 
}

Convert CSS HEX color to RGBA color and returns RGBA color value.

Details:

• color: The css HEX color value

rgbaToHex

class Color {
  static rgbaToHex(color: RGBA): string; 
}

Convert RGB/RGBA color to CSS HEX color format and returns CSS HEX color value.

Details:

• color: The RGB/RGBA color value

rgbaToHsva

class Color {
  static rgbaToHsva(color: RGBA): HSVA; 
}

Convert RGBA to HSVA and returns HSVA color value.

Details:

• color: The RGBA color value

rgbaToString

class Color {
  static rgbaToString(color: RGBA): string; 
}

Convert RGB/RGBA color to string and returns CSS color string.

Details:

• color: The RGB/RGBA color value

rgbaFromString

class Color {
  static rgbaFromString(canvasCtx: CanvasRenderingContext2D, source: string): RGBA; 
}

Parse a string to RGBA and returns RGBA color value.

Details:

• canvasCtx: The canvas rendering context
• source: String representing a color.

brightnessLevel

class Color {
  static brightnessLevel(color: RGBA): number; 
}

Get brightness level from RGBA color and returns brightness level.

Details:

• color: The RGB/RGBA color value

shadeColor

class Color {
  static shadeColor(color: string | RGBA, lightness: number): string; 
}

Darken or lighten the input color. Use negative lightness value to darken the input color or otherwise to lighten the input color. Returns color result in CSS HEX color format.

Details:

• color: The color to darken or lighten
• lightness: The lightness level