Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

不透明度与十六进制值 #337

Open
toFrankie opened this issue May 1, 2024 · 0 comments
Open

不透明度与十六进制值 #337

toFrankie opened this issue May 1, 2024 · 0 comments
Labels
2024 2024 年撰写 CSS 与 CSS、CSS preprocessor 相关的文章

Comments

@toFrankie
Copy link
Owner

toFrankie commented May 1, 2024

配图源自 Freepik

转换方法:

function opacity2hex(opacity) {
  const hexValue = Math.round((opacity / 100) * 255)
  const hexString = hexValue.toString(16).padStart(2, '0')
  return hexString
}
function hex2opacity(hex) {
  const decimalValue = parseInt(hex, 16)
  const opacity = Math.round((decimalValue / 255) * 100)
  return opacity
}

0% ~ 100%

百分比(不透明度) 十六进制值
0% 00
10% 1A
20% 33
30% 4D
40% 66
50% 80
60% 99
70% B3
80% CC
90% E6
100% FF

0% ~ 10%

展开
百分比(不透明度) 十六进制值
0% 00
1% 03
2% 05
3% 08
4% 0A
5% 0D
6% 0F
7% 12
8% 14
9% 17
10% 1A

11% ~ 20%

展开
百分比(不透明度) 十六进制值
11% 1C
12% 1F
13% 21
14% 24
15% 26
16% 29
17% 2B
18% 2E
19% 30
20% 33

21% ~ 30%

展开
百分比(不透明度) 十六进制值
21% 36
22% 38
23% 3B
24% 3D
25% 40
26% 42
27% 45
28% 47
29% 4A
30% 4D

31% ~ 40%

展开
百分比(不透明度) 十六进制值
31% 4F
32% 52
33% 54
34% 57
35% 59
36% 5C
37% 5E
38% 61
39% 63
40% 66

41% ~ 50%

展开
百分比(不透明度) 十六进制值
41% 69
42% 6B
43% 6E
44% 70
45% 73
46% 75
47% 78
48% 7A
49% 7D
50% 80

51% ~ 60%

展开
百分比(不透明度) 十六进制值
51% 82
52% 85
53% 87
54% 8A
55% 8C
56% 8F
57% 91
58% 94
59% 96
60% 99

61% ~ 70%

展开
百分比(不透明度) 十六进制值
61% 9C
62% 9E
63% A1
64% A3
65% A6
66% A8
67% AB
68% AD
69% B0
70% B3

71% ~ 80%

展开
百分比(不透明度) 十六进制值
71% B5
72% B8
73% BA
74% BD
75% BF
76% C2
77% C4
78% C7
79% C9
80% CC

81% ~ 90%

展开
百分比(不透明度) 十六进制值
81% CF
82% D1
83% D4
84% D6
85% D9
86% DB
87% DE
88% E0
89% E3
90% E6

91% ~ 100%

展开
百分比(不透明度) 十六进制值
91% E8
92% EB
93% ED
94% F0
95% F2
96% F5
97% F7
98% FA
99% FC
100% FF
@toFrankie toFrankie added 2024 2024 年撰写 CSS 与 CSS、CSS preprocessor 相关的文章 labels May 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
2024 2024 年撰写 CSS 与 CSS、CSS preprocessor 相关的文章
Projects
None yet
Development

No branches or pull requests

1 participant