Preview 2.0 is now in Public Beta!
Read the Announcement
Note: You are on the beta version of our docs. This is a work in progress and may contain broken links and pages.
Color
Represents a color object. Stores all color components (alpha (opacity), red, green, blue) in a [0..255] range.

Summary ​

Constructors ​

constructor ​

new Color(knownColor: string): Color
Parameter Default Description
knownColor
string

Returns Color
new Color(hex: string): Color
Parameter Default Description
hex
string

Returns Color
new Color(argb: number): Color
Parameter Default Description
argb
number

Returns Color
new Color(alpha: number, red: number, green: number, blue: number, type?: "rgb" | "hsl" | "hsv"): Color
Parameter Default Description
alpha
number

red
number

green
number

blue
number

type
"rgb" | "hsl" | "hsv"

Returns Color

Properties ​

a ​

a: number
Gets the Alpha component (in the [0, 255] range) of this color. This is a read-only property.

android ​

android: number
Gets the android-specific integer value representation. Same as the Argb one. This is a read-only property.

argb ​

argb: number
Gets the Argb Number representation of this color where each 8 bits represent a single color component. This is a read-only property.

b ​

b: number
Gets the Blue component (in the [0, 255] range) of this color. This is a read-only property.

g ​

g: number
Gets the Green component (in the [0, 255] range) of this color. This is a read-only property.

hex ​

hex: string
Gets the Hexadecimal string representation of this color. This is a read-only property.

ios ​

ios: any
Gets the iOS-specific UIColor value representation. This is a read-only property.

name ​

name: string
Gets the known name of this instance. Defined only if it has been constructed from a known color name - e.g. "red". This is a read-only property.

r ​

r: number
Gets the Red component (in the [0, 255] range) of this color. This is a read-only property.

Methods ​

brighten ​

brighten(amount: number): Color
Brighten the color a given amount, from 0 to 100.
Parameter Default Description
amount
number

(between 0 and 100)

Returns Color

complement ​

complement(): Color
returns the color complement
Returns Color

darken ​

darken(amount: number): Color
Darken the color a given amount, from 0 to 100. Providing 100 will always return black.
Parameter Default Description
amount
number

(between 0 and 100)

Returns Color

desaturate ​

desaturate(amount: number): Color
Desaturate the color a given amount, from 0 to 100. Providing 100 will is the same as calling greyscale.
Parameter Default Description
amount
number

(between 0 and 100)

Returns Color

equals ​

equals(value: Color): boolean
Specifies whether this Color is equal to the Color parameter.
Parameter Default Description
value
Color

The Color to test.

Returns boolean

getBrightness ​

getBrightness(): number
return the [brightness](http://www.w3.org/TR/AERT#color-contrast)
Returns number

getLuminance ​

getLuminance(): number
return the [luminance](http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef)
Returns number

greyscale ​

greyscale(): Color
Completely desaturates a color into greyscale. Same as calling desaturate(100).
Returns Color

isDark ​

isDark(): boolean
return true if brightenss < 128
Returns boolean

isLight ​

isLight(): boolean
return true if brightenss >= 128
Returns boolean

lighten ​

lighten(amount: number): Color
Lighten the color a given amount, from 0 to 100. Providing 100 will always return white.
Parameter Default Description
amount
number

(between 0 and 100)

Returns Color

saturate ​

saturate(amount: number): Color
Saturate the color a given amount, from 0 to 100.
Parameter Default Description
amount
number

(between 0 and 100)

Returns Color

setAlpha ​

setAlpha(a: number): Color
Return this color (as a new Color instance) with the provided alpha
Parameter Default Description
a
number

Returns Color

spin ​

spin(amount: number): Color
Spin the hue a given amount, from -360 to 360. Calling with 0, 360, or -360 will do nothing (since it sets the hue back to what it was before).
Parameter Default Description
amount
number

(between 0 and 100)

Returns Color

toHsl ​

toHsl(): {
  a: number
  h: number
  l: number
}
return the hsl representation of the color
Returns { a: number h: number l: number }

toHslString ​

toHslString(): string
return the [CSS hsv](https://www.w3schools.com/Css/css_colors_hsl.asp) representation of the color
Returns string

toHsv ​

toHsv(): {
  a: number
  h: number
  s: number
}
return the hsv representation of the color
Returns { a: number h: number s: number }

toHsvString ​

toHsvString(): string
return the [CSS hsv](https://www.w3schools.com/Css/css_colors_rgb.asp) representation of the color
Returns string

toRgbString ​

toRgbString(): string
return the [CSS rgb](https://www.w3schools.com/Css/css_colors_rgb.asp) representation of the color
Returns string

equals ​

Static
equals(value1: Color, value2: Color): boolean
Compares two Color instances.
Parameter Default Description
value1
Color

A Color to compare.

value2
Color

A Color to compare.

Returns boolean

fromHSL ​

Static
fromHSL(a: any, h: any, s: any, l: any): Color
returns a new Color from HSL
Parameter Default Description
a
any

h
any

s
any

l
any

Returns Color

fromHSV ​

Static
fromHSV(a: any, h: any, s: any, l: any): Color
Parameter Default Description
a
any

h
any

s
any

l
any

Returns Color

fromIosColor ​

Static
fromIosColor(value: any): Color
Creates color from iOS-specific UIColor value representation.
Parameter Default Description
value
any

Returns Color

isValid ​

Static
isValid(value: any): boolean
Validates if a value can be converted to color.
Parameter Default Description
value
any

Input string.

Returns boolean

mix ​

Static
mix(color1: Color, color2: Color, amount: number): Color
returns the color complement
Parameter Default Description
color1
Color

color2
Color

amount
number

Returns Color
Next
ContainerView