Skip to content

TinyColor

构造函数

IMPORTANT

构造颜色对象请不要直接 new TinyColor(),而是通过 colorLib.tinyColor() 函数创建。

名称类型必备默认值描述
colorAny''处理后的输入颜色
optsLColorOptions{} as LColorOptions颜色配置

属性

名称类型描述
originalInputAny传递到构造函数中用于创建 TinyColor 实例的原始输入
formatString返回用于创建 TinyColor 实例的格式
isValidBoolean一个布尔值,指示颜色是否成功被解析。注意:如果颜色无效,那么输出颜色值时默认黑色

方法

名称参数返回值描述
getBrightness-Number返回颜色的感知亮度,范围从 0-255,这是根据 Web内容无障碍指南(第1版) 定义的。
isLight-Boolean返回一个布尔值,指示颜色的感知亮度是否为浅色。
isDark-Boolean返回一个布尔值,指示颜色的感知亮度是否为深色。
getLuminance-Number返回颜色的感知亮度(luminance),范围从 0-1,这是根据 Web内容无障碍指南(第2版) 定义的。
getAlpha-Number返回颜色的alpha(透明度)值,范围从 0-1
setAlpha(alpha: number)-在当前颜色上设置alpha(透明度)值。接受的范围是 0-1 之间。
onBackground(background: any)-计算颜色在背景上的显示效果。当颜色完全透明(即 getAlpha() == 0)时,结果将是背景颜色。当颜色完全不透明(即 getAlpha() == 1)时,结果将是颜色本身。否则,你将得到一个计算结果。
toHsv-HSVA转为 HSVA 颜色对象
toHsvString-String转为 HSVA 颜色字符串
toHsl-HSLA转为 HSLA 颜色对象
toHslString-String转为 HSLA 颜色字符串
toNumber-Number转为数字
toHex-String转为 Hex 颜色(不带 #
toHexString-String转为 Hex 颜色字符串(带 #
toHex8-String转为 Hex 颜色(不带 # 、有透明度)
toHex8String-String转为 Hex 颜色(带 # 、有透明度)
toHexShortString-String根据颜色的透明度(alpha 值)返回较短的十六进制值,并且带 #
toRgb-RGBA转为 RGBA 颜色对象
toRgbString-String转为 RGBA 颜色字符串
toPercentageRgb-RGBAString将当前颜色转换为百分比表示的 RGBA
toPercentageRgbString-String将当前颜色转换为百分比表示的 RGBA
toName-String尽可能转换为颜色名称
toString(format: string)String根据输入格式打印成字符串。你也可以通过向函数中传入以下之一来覆盖这个行为:"rgb", "prgb", "hex6", "hex3", "hex8", "name", "hsl", "hsv"
lighten(amount: Number = 10)TinyColor根据给定的量(从0到100)淡化颜色。提供100将始终返回白色.
brighten(amount: Number = 10)TinyColor根据给定的量(从0到100)调高颜色亮度。提供100将始终返回白色.
darken(amount: Number = 10)TinyColor根据给定的量(从0到100)深化颜色。提供100将始终返回白色.
tint(amount: Number = 10)TinyColor将颜色与纯白色混合,范围从0到100。提供0将不进行任何操作,提供100将始终返回白色.
shade(amount: Number = 10)TinyColor将颜色与纯黑色混合,范围从0到100。提供0将不进行任何操作,提供100将始终返回黑色.
desaturate(amount: Number = 10)TinyColor根据给定的量(从0到100)降低颜色的饱和度。提供100将与调用greyscale相同。
saturate(amount: Number = 10)TinyColor根据给定的量(从0到100)增加颜色的饱和度。
greyscale-TinyColor完全降低颜色的饱和度,使其变为灰度。与调用desaturate(100)相同。
spin(amount: Number = 0)TinyColor根据给定的量(从-360到360)旋转色相。调用时使用0、360或-360将不进行任何操作(因为它将色相设置回原来的值)。
mix(amount: Number = 50)TinyColor将当前颜色与另一种颜色按给定量(从0到100)混合。0表示不混合(返回当前颜色)。
analogous(results: Number = 6, slices: Number = 30)TinyColor[]生成一组与当前颜色相似的颜色。这些颜色在色相环上是相邻的,形成一个类似于彩虹的颜色序列。
results - 要生成的相似颜色的数量;
slices - 将色相环划分为多少个部分
monochromatic(results: Number = 6)TinyColor[]生成一组与当前颜色具有相同色相和饱和度的颜色。这些颜色的亮度值不同,形成一个单色调的颜色序列。
results - 要生成的单色调颜色的数量
splitcomplement-TinyColor[]生成当前颜色的分裂补色。分裂补色是指在色相环上位于当前颜色的两侧的颜色,它们的色相差为 180°。
triad-TinyColor[]生成当前颜色的三色调。
tetrad-TinyColor[]生成当前颜色的四色调。
polyad(n: number)TinyColor[]生成当前颜色的 n 色调。
complement-TinyColor计算当前颜色的补色。
equals(color?:any)Boolean判断两色是否相同
clone-TinyColor使用相同的颜色实例化一个新的TinyColor对象。对新的对象的任何更改都不会影响旧的对象。
contrasting-TinyColor获取以当前颜色为背景时前景的最佳颜色(黑色或白色)。即判断黑色与白色哪一个与当前颜色的视觉对比最大。

使用 MIT 协议