Class TinyColor

Constructors

constructor

new TinyColor(color?, opts?): TinyColor
Parameters
- color: ColorInput = ''
- opts: Partial<TinyColorOptions> = {}
Returns TinyColor
- Defined in index.ts:61

Properties

a

a: number

alpha

b

b: number

blue

format

format: ColorFormats

the format used to create the tinycolor instance

g

g: number

green

`Optional` gradientType

gradientType?: string

isValid

isValid: boolean

the color was successfully parsed

originalInput

originalInput: ColorInput

input passed into the constructer used to create the tinycolor instance

r

r: number

red

roundA

roundA: number

rounded alpha

Methods

analogous

analogous(results?, slices?): TinyColor[]
Parameters
- results: number = 6
- slices: number = 30
Returns TinyColor[]
- Defined in index.ts:532

brighten

brighten(amount?): TinyColor
Brighten the color a given amount, from 0 to 100.
Parameters
- amount: number = 10
  valid between 1-100
Returns TinyColor
- Defined in index.ts:433

clone

clone(): TinyColor
Returns TinyColor
- Defined in index.ts:414

complement

complement(): TinyColor
taken from https://github.com/infusion/jQuery-xcolor/blob/master/jquery.xcolor.js

Returns TinyColor
- Defined in index.ts:548

darken

darken(amount?): TinyColor
Darken the color a given amount, from 0 to 100. Providing 100 will always return black.
Parameters
- amount: number = 10
  valid between 1-100
Returns TinyColor
- Defined in index.ts:446

desaturate

desaturate(amount?): TinyColor
Desaturate the color a given amount, from 0 to 100. Providing 100 will is the same as calling greyscale
Parameters
- amount: number = 10
  valid between 1-100
Returns TinyColor
- Defined in index.ts:476

equals

equals(color?): boolean
compare color vs current color
Parameters
- Optional color: ColorInput
Returns boolean
- Defined in index.ts:630

getAlpha

getAlpha(): number
Returns the alpha value of a color, from 0-1.

Returns number
- Defined in index.ts:159

getBrightness

getBrightness(): number
Returns the perceived brightness of the color, from 0-255.

Returns number
- Defined in index.ts:113

getLuminance

getLuminance(): number
Returns the perceived luminance of a color, from 0-1.

Returns number
- Defined in index.ts:122

greyscale

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

Returns TinyColor
- Defined in index.ts:498

isDark

isDark(): boolean
Returns boolean
- Defined in index.ts:102

isLight

isLight(): boolean
Returns boolean
- Defined in index.ts:106

isMonochrome

isMonochrome(): boolean
Returns whether the color is monochrome.

Returns boolean
- Defined in index.ts:177

lighten

lighten(amount?): TinyColor
Lighten the color a given amount. Providing 100 will always return white.
Parameters
- amount: number = 10
  valid between 1-100
Returns TinyColor
- Defined in index.ts:422

mix

mix(color, amount?): TinyColor
Mix the current color a given amount with another color, from 0 to 100. 0 means no mixing (return current color).
Parameters
- color: ColorInput
- amount: number = 50
Returns TinyColor
- Defined in index.ts:517

monochromatic

monochromatic(results?): TinyColor[]
Parameters
- results: number = 6
Returns TinyColor[]
- Defined in index.ts:554

onBackground

onBackground(background): TinyColor
Compute how the color would appear on a background
Parameters
- background: ColorInput
Returns TinyColor
- Defined in index.ts:583

polyad

polyad(n): TinyColor[]
Get polyad colors, like (for 1, 2, 3, 4, 5, 6, 7, 8, etc...) monad, dyad, triad, tetrad, pentad, hexad, heptad, octad, etc...
Parameters
- n: number
Returns TinyColor[]
- Defined in index.ts:614

saturate

saturate(amount?): TinyColor
Saturate the color a given amount, from 0 to 100.
Parameters
- amount: number = 10
  valid between 1-100
Returns TinyColor
- Defined in index.ts:487

setAlpha

setAlpha(alpha?): this
Sets the alpha value on the current color.
Parameters
- Optional alpha: string | number
  The new alpha value. The accepted range is 0-1.
Returns this
- Defined in index.ts:168

shade

shade(amount?): TinyColor
Mix the color with pure black, from 0 to 100. Providing 0 will do nothing, providing 100 will always return black.
Parameters
- amount: number = 10
  valid between 1-100
Returns TinyColor
- Defined in index.ts:467

spin

spin(amount): TinyColor
Spin takes a positive or negative amount within [-360, 360] indicating the change of hue. Values outside of this range will be wrapped into this range.
Parameters
- amount: number
Returns TinyColor
- Defined in index.ts:506

splitcomplement

splitcomplement(): TinyColor[]
Returns TinyColor[]
- Defined in index.ts:570

tetrad

tetrad(): TinyColor[]
Alias for polyad(4)

Returns TinyColor[]
- Defined in index.ts:606

tint

tint(amount?): TinyColor
Mix the color with pure white, from 0 to 100. Providing 0 will do nothing, providing 100 will always return white.
Parameters
- amount: number = 10
  valid between 1-100
Returns TinyColor
- Defined in index.ts:458

toCmyk

toCmyk(): Numberify<CMYK>
Returns Numberify<CMYK>
- Defined in index.ts:308

toCmykString

toCmykString(): string
Returns string
- Defined in index.ts:314

toHex

toHex(allow3Char?): string
Returns the hex value of the color.
Parameters
- allow3Char: boolean = false
  will shorten hex value to 3 char if possible
Returns string
- Defined in index.ts:226

toHex8

toHex8(allow4Char?): string
Returns the hex 8 value of the color.
Parameters
- allow4Char: boolean = false
  will shorten hex value to 4 char if possible
Returns string
- Defined in index.ts:242

toHex8String

toHex8String(allow4Char?): string
Returns the hex 8 value of the color -with a # prefixed.
Parameters
- allow4Char: boolean = false
  will shorten hex value to 4 char if possible
Returns string
- Defined in index.ts:250

toHexShortString

toHexShortString(allowShortChar?): string
Returns the shorter hex value of the color depends on its alpha -with a # prefixed.
Parameters
- allowShortChar: boolean = false
  will shorten hex value to 3 or 4 char if possible
Returns string
- Defined in index.ts:258

toHexString

toHexString(allow3Char?): string
Returns the hex value of the color -with a # prefixed.
Parameters
- allow3Char: boolean = false
  will shorten hex value to 3 char if possible
Returns string
- Defined in index.ts:234

toHsl

toHsl(): Numberify<HSLA>
Returns the object as a HSLA object.

Returns Numberify<HSLA>
- Defined in index.ts:205

toHslString

toHslString(): string
Returns the hsla values interpolated into a string with the following format: "hsla(xxx, xxx, xxx, xx)".

Returns string
- Defined in index.ts:214

toHsv

toHsv(): Numberify<HSVA>
Returns the object as a HSVA object.

Returns Numberify<HSVA>
- Defined in index.ts:185

toHsvString

toHsvString(): string
Returns the hsva values interpolated into a string with the following format: "hsva(xxx, xxx, xxx, xx)".

Returns string
- Defined in index.ts:194

toName

toName(): string | false
The 'real' name of the color -if there is one.

Returns string | false
- Defined in index.ts:322

toNumber

toNumber(): number
Returns number
- Defined in index.ts:410

toPercentageRgb

toPercentageRgb(): RGBA
Returns the object as a RGBA object.

Returns RGBA
- Defined in index.ts:288

toPercentageRgbString

toPercentageRgbString(): string
Returns the RGBA relative values interpolated into a string

Returns string
- Defined in index.ts:301

toRgb

toRgb(): Numberify<RGBA>
Returns the object as a RGBA object.

Returns Numberify<RGBA>
- Defined in index.ts:265

toRgbString

toRgbString(): string
Returns the RGBA values interpolated into a string with the following format: "RGBA(xxx, xxx, xxx, xx)".

Returns string
- Defined in index.ts:278

toString

toString<T>(format): string | boolean
String representation of the color.
Type Parameters
- T extends "name"
Parameters
- format: T
  The format to be used when displaying the string representation.
Returns string | boolean
- Defined in index.ts:346
toString<T>(format?): string
Type Parameters
- T extends ColorFormats
Parameters
- Optional format: T
Returns string
- Defined in index.ts:347

triad

triad(): TinyColor[]
Alias for polyad(3)

Returns TinyColor[]
- Defined in index.ts:599