首次提交

zhuguifei

2026-03-02 80ff784bf60637cd348ae665fc907f7b1e527dd8

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
import { colord, extend } from 'colord';
import namesPlugin from 'colord/plugins/names';
import mixPlugin from 'colord/plugins/mix';
import labPlugin from 'colord/plugins/lab';
import type { AnyColor, HslColor, RgbColor } from 'colord';
 
extend([namesPlugin, mixPlugin, labPlugin]);
 
export function isValidColor(color: AnyColor) {
  return colord(color).isValid();
}
 
export function getHex(color: AnyColor) {
  return colord(color).toHex();
}
 
export function getRgb(color: AnyColor) {
  return colord(color).toRgb();
}
 
export function getHsl(color: AnyColor) {
  return colord(color).toHsl();
}
 
export function getHsv(color: AnyColor) {
  return colord(color).toHsv();
}
 
export function getDeltaE(color1: AnyColor, color2: AnyColor) {
  return colord(color1).delta(color2);
}
 
export function transformHslToHex(color: HslColor) {
  return colord(color).toHex();
}
 
/**
 * Add color alpha
 *
 * @param color - Color
 * @param alpha - Alpha (0 - 1)
 */
export function addColorAlpha(color: AnyColor, alpha: number) {
  return colord(color).alpha(alpha).toHex();
}
 
/**
 * Mix color
 *
 * @param firstColor - First color
 * @param secondColor - Second color
 * @param ratio - The ratio of the second color (0 - 1)
 */
export function mixColor(firstColor: AnyColor, secondColor: AnyColor, ratio: number) {
  return colord(firstColor).mix(secondColor, ratio).toHex();
}
 
/**
 * Transform color with opacity to similar color without opacity
 *
 * @param color - Color
 * @param alpha - Alpha (0 - 1)
 * @param bgColor Background color (usually white or black)
 */
export function transformColorWithOpacity(color: AnyColor, alpha: number, bgColor = '#ffffff') {
  const originColor = addColorAlpha(color, alpha);
  const { r: oR, g: oG, b: oB } = colord(originColor).toRgb();
 
  const { r: bgR, g: bgG, b: bgB } = colord(bgColor).toRgb();
 
  function calRgb(or: number, bg: number, al: number) {
    return bg + (or - bg) * al;
  }
 
  const resultRgb: RgbColor = {
    r: calRgb(oR, bgR, alpha),
    g: calRgb(oG, bgG, alpha),
    b: calRgb(oB, bgB, alpha)
  };
 
  return colord(resultRgb).toHex();
}
 
/**
 * Is white color
 *
 * @param color - Color
 */
export function isWhiteColor(color: AnyColor) {
  return colord(color).isEqual('#ffffff');
}
 
export { colord };