码译 · VibeCode

AI 配色方案库

100 套为网页 / App / 品牌精心调配的 AI 配色方案，每套都标注色值、色名与适用场景，点「复制配色 JSON」即可拿走。每套配色都是独立可索引的页面区块（带锚点 #no-xxx），方便搜索引擎收录与分享。

COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

01科技蓝·标准

科技蓝#3171B9

主色#3171B9
主色浅#6EA0D8
辅色#5467C5
强调色#269DD9
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：SaaS 后台、数据看板、金融科技

色相 212°分类 科技互联网共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

02科技蓝·浅色

科技蓝#729BCA

主色#729BCA
主色浅#B5CAE3
辅色#959FD0
强调色#45A4D3
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：SaaS 后台、数据看板、金融科技

色相 212°分类 科技互联网共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

03科技蓝·暗色

科技蓝#5490D4

主色#5490D4
主色浅#9DBFE7
辅色#3E54C1
强调色#58B5E4
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：SaaS 后台、数据看板、金融科技

色相 212°分类 科技互联网共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

04科技蓝·高饱和

科技蓝#1C79E3

主色#1C79E3
主色浅#6EA9ED
辅色#405AD8
强调色#1DA7ED
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：SaaS 后台、数据看板、金融科技

色相 212°分类 科技互联网共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

05科技蓝·柔和

科技蓝#6D8DB0

主色#6D8DB0
主色浅#A9BBD1
辅色#8C94BB
强调色#69A2BF
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：SaaS 后台、数据看板、金融科技

色相 212°分类 科技互联网共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

06深海蓝·标准

深海蓝#315AB9

主色#315AB9
主色浅#6E8ED8
辅色#5454C5
强调色#268ED9
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：B 端管理台、CRM、ERP

色相 222°分类 企业后台共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

07深海蓝·浅色

深海蓝#728DCA

主色#728DCA
主色浅#B5C3E3
辅色#9595D0
强调色#4598D3
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：B 端管理台、CRM、ERP

色相 222°分类 企业后台共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

08深海蓝·暗色

深海蓝#547AD4

主色#547AD4
主色浅#9DB3E7
辅色#3E3EC1
强调色#58AAE4
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：B 端管理台、CRM、ERP

色相 222°分类 企业后台共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

09深海蓝·高饱和

深海蓝#1C58E3

主色#1C58E3
主色浅#6E94ED
辅色#4040D8
强调色#1D96ED
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：B 端管理台、CRM、ERP

色相 222°分类 企业后台共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

10深海蓝·柔和

深海蓝#6D81B0

主色#6D81B0
主色浅#A9B5D1
辅色#8C8CBB
强调色#699BBF
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：B 端管理台、CRM、ERP

色相 222°分类 企业后台共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

11湖心绿·标准

湖心绿#31B99E

主色#31B99E
主色浅#6ED8C3
辅色#54BAC5
强调色#26D980
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：医疗健康、养生应用

色相 168°分类 环保健康共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

12湖心绿·浅色

湖心绿#72CAB8

主色#72CAB8
主色浅#B5E3DA
辅色#95CAD0
强调色#45D38C
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：医疗健康、养生应用

色相 168°分类 环保健康共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

13湖心绿·暗色

湖心绿#54D4BA

主色#54D4BA
主色浅#9DE7D8
辅色#3EB4C1
强调色#58E49E
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：医疗健康、养生应用

色相 168°分类 环保健康共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

14湖心绿·高饱和

湖心绿#1CE3BB

主色#1CE3BB
主色浅#6EEDD4
辅色#40C9D8
强调色#1DED85
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：医疗健康、养生应用

色相 168°分类 环保健康共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

15湖心绿·柔和

湖心绿#6DB0A3

主色#6DB0A3
主色浅#A9D1C9
辅色#8CB6BB
强调色#69BF94
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：医疗健康、养生应用

色相 168°分类 环保健康共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

16薄荷绿·标准

薄荷绿#31B97A

主色#31B97A
主色浅#6ED8A7
辅色#54C5B2
强调色#26D9BB
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：生鲜电商、外卖平台

色相 152°分类 生活服务共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

17薄荷绿·浅色

薄荷绿#72CAA1

主色#72CAA1
主色浅#B5E3CE
辅色#95D0C6
强调色#45D3BC
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：生鲜电商、外卖平台

色相 152°分类 生活服务共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

18薄荷绿·暗色

薄荷绿#54D498

主色#54D498
主色浅#9DE7C4
辅色#3EC1AB
强调色#58E4CD
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：生鲜电商、外卖平台

色相 152°分类 生活服务共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

19薄荷绿·高饱和

薄荷绿#1CE386

主色#1CE386
主色浅#6EEDB2
辅色#40D8BF
强调色#1DEDCA
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：生鲜电商、外卖平台

色相 152°分类 生活服务共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

20薄荷绿·柔和

薄荷绿#6DB091

主色#6DB091
主色浅#A9D1BE
辅色#8CBBB3
强调色#69BFB0
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：生鲜电商、外卖平台

色相 152°分类 生活服务共 12 色
展开剩余 80 套配色（共 100 套，全部可被搜索引擎收录）
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

21森野绿·标准

森野绿#31B953

主色#31B953
主色浅#6ED889
辅色#54C592
强调色#71D926
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：旅行攻略、园艺社区

色相 135°分类 自然户外共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

22森野绿·浅色

森野绿#72CA88

主色#72CA88
主色浅#B5E3C1
辅色#95D0B5
强调色#80D345
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：旅行攻略、园艺社区

色相 135°分类 自然户外共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

23森野绿·暗色

森野绿#54D474

主色#54D474
主色浅#9DE7AF
辅色#3EC186
强调色#92E458
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：旅行攻略、园艺社区

色相 135°分类 自然户外共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

24森野绿·高饱和

森野绿#1CE34E

主色#1CE34E
主色浅#6EED8E
辅色#40D894
强调色#73ED1D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：旅行攻略、园艺社区

色相 135°分类 自然户外共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

25森野绿·柔和

森野绿#6DB07E

主色#6DB07E
主色浅#A9D1B3
辅色#8CBBA6
强调色#8DBF69
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：旅行攻略、园艺社区

色相 135°分类 自然户外共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

26暖阳橙·标准

暖阳橙#B97131

主色#B97131
主色浅#D8A06E
辅色#C5AA54
强调色#D94A26
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：电商大促、品牌商城

色相 28°分类 消费零售共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

27暖阳橙·浅色

暖阳橙#CA9B72

主色#CA9B72
主色浅#E3CAB5
辅色#D0C295
强调色#D36245
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：电商大促、品牌商城

色相 28°分类 消费零售共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

28暖阳橙·暗色

暖阳橙#D49054

主色#D49054
主色浅#E7BF9D
辅色#C1A23E
强调色#E47458
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：电商大促、品牌商城

色相 28°分类 消费零售共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

29暖阳橙·高饱和

暖阳橙#E3791C

主色#E3791C
主色浅#EDA96E
辅色#D8B540
强调色#ED461D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：电商大促、品牌商城

色相 28°分类 消费零售共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

30暖阳橙·柔和

暖阳橙#B08D6D

主色#B08D6D
主色浅#D1BBA9
辅色#BBB08C
强调色#BF7A69
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：电商大促、品牌商城

色相 28°分类 消费零售共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

31落日橘·标准

落日橘#B95A31

主色#B95A31
主色浅#D88E6E
辅色#C59854
强调色#D92644
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：餐饮外卖、新式茶饮

色相 18°分类 美食餐饮共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

32落日橘·浅色

落日橘#CA8D72

主色#CA8D72
主色浅#E3C3B5
辅色#D0B895
强调色#D3455D
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：餐饮外卖、新式茶饮

色相 18°分类 美食餐饮共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

33落日橘·暗色

落日橘#D47A54

主色#D47A54
主色浅#E7B39D
辅色#C18D3E
强调色#E45870
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：餐饮外卖、新式茶饮

色相 18°分类 美食餐饮共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

34落日橘·高饱和

落日橘#E3581C

主色#E3581C
主色浅#ED946E
辅色#D89B40
强调色#ED1D3F
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：餐饮外卖、新式茶饮

色相 18°分类 美食餐饮共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

35落日橘·柔和

落日橘#B0816D

主色#B0816D
主色浅#D1B5A9
辅色#BBA88C
强调色#BF6977
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：餐饮外卖、新式茶饮

色相 18°分类 美食餐饮共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

36蜜桃粉·标准

蜜桃粉#B9315F

主色#B9315F
主色浅#D86E91
辅色#C55457
强调色#D9269D
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：美妆护肤、穿搭社区

色相 340°分类 女性时尚共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

37蜜桃粉·浅色

蜜桃粉#CA7290

主色#CA7290
主色浅#E3B5C4
辅色#D09597
强调色#D345A4
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：美妆护肤、穿搭社区

色相 340°分类 女性时尚共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

38蜜桃粉·暗色

蜜桃粉#D4547E

主色#D4547E
主色浅#E79DB6
辅色#C13E43
强调色#E458B5
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：美妆护肤、穿搭社区

色相 340°分类 女性时尚共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

39蜜桃粉·高饱和

蜜桃粉#E31C5E

主色#E31C5E
主色浅#ED6E98
辅色#D84045
强调色#ED1DA7
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：美妆护肤、穿搭社区

色相 340°分类 女性时尚共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

40蜜桃粉·柔和

蜜桃粉#B06D84

主色#B06D84
主色浅#D1A9B6
辅色#BB8C8D
强调色#BF69A2
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：美妆护肤、穿搭社区

色相 340°分类 女性时尚共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

41樱花粉·标准

樱花粉#B93148

主色#B93148
主色浅#D86E80
辅色#C56354
强调色#D9269D
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：兴趣社区、UGC 平台

色相 350°分类 社交社区共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

42樱花粉·浅色

樱花粉#CA7281

主色#CA7281
主色浅#E3B5BD
辅色#D09D95
强调色#D345A4
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：兴趣社区、UGC 平台

色相 350°分类 社交社区共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

43樱花粉·暗色

樱花粉#D45469

主色#D45469
主色浅#E79DA9
辅色#C1503E
强调色#E458B5
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：兴趣社区、UGC 平台

色相 350°分类 社交社区共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

44樱花粉·高饱和

樱花粉#E31C3D

主色#E31C3D
主色浅#ED6E83
辅色#D85440
强调色#ED1DA7
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：兴趣社区、UGC 平台

色相 350°分类 社交社区共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

45樱花粉·柔和

樱花粉#B06D78

主色#B06D78
主色浅#D1A9AF
辅色#BB928C
强调色#BF69A2
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：兴趣社区、UGC 平台

色相 350°分类 社交社区共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

46葡萄紫·标准

葡萄紫#8131B9

主色#8131B9
主色浅#AC6ED8
辅色#B854C5
强调色#D926D9
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：音乐播放、阅读应用

色相 275°分类 文创娱乐共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

47葡萄紫·浅色

葡萄紫#A572CA

主色#A572CA
主色浅#D0B5E3
辅色#C995D0
强调色#D345D3
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：音乐播放、阅读应用

色相 275°分类 文创娱乐共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

48葡萄紫·暗色

葡萄紫#9F54D4

主色#9F54D4
主色浅#C89DE7
辅色#B13EC1
强调色#E458E4
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：音乐播放、阅读应用

色相 275°分类 文创娱乐共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

49葡萄紫·高饱和

葡萄紫#901CE3

主色#901CE3
主色浅#B86EED
辅色#C740D8
强调色#ED1DED
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：音乐播放、阅读应用

色相 275°分类 文创娱乐共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

50葡萄紫·柔和

葡萄紫#946DB0

主色#946DB0
主色浅#C0A9D1
辅色#B58CBB
强调色#BF69BF
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：音乐播放、阅读应用

色相 275°分类 文创娱乐共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

51午夜紫·标准

午夜紫#6331B9

主色#6331B9
主色浅#956ED8
辅色#9F54C5
强调色#2680D9
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：游戏官网、电竞社区

色相 262°分类 科技暗黑共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

52午夜紫·浅色

午夜紫#9272CA

主色#9272CA
主色浅#C6B5E3
辅色#BC95D0
强调色#458CD3
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：游戏官网、电竞社区

色相 262°分类 科技暗黑共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

53午夜紫·暗色

午夜紫#8354D4

主色#8354D4
主色浅#B89DE7
辅色#953EC1
强调色#589EE4
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：游戏官网、电竞社区

色相 262°分类 科技暗黑共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

54午夜紫·高饱和

午夜紫#651CE3

主色#651CE3
主色浅#9C6EED
辅色#A640D8
强调色#1D85ED
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：游戏官网、电竞社区

色相 262°分类 科技暗黑共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

55午夜紫·柔和

午夜紫#866DB0

主色#866DB0
主色浅#B7A9D1
辅色#AB8CBB
强调色#6994BF
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：游戏官网、电竞社区

色相 262°分类 科技暗黑共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

56石墨黑·标准

石墨黑#315FB9

主色#315FB9
主色浅#6E91D8
辅色#5457C5
强调色#D98026
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：品牌官网、硬件产品

色相 220°分类 极简高端共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

57石墨黑·浅色

石墨黑#7290CA

主色#7290CA
主色浅#B5C4E3
辅色#9597D0
强调色#D38C45
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：品牌官网、硬件产品

色相 220°分类 极简高端共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

58石墨黑·暗色

石墨黑#547ED4

主色#547ED4
主色浅#9DB6E7
辅色#3E43C1
强调色#E49E58
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：品牌官网、硬件产品

色相 220°分类 极简高端共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

59石墨黑·高饱和

石墨黑#1C5EE3

主色#1C5EE3
主色浅#6E98ED
辅色#4045D8
强调色#ED851D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：品牌官网、硬件产品

色相 220°分类 极简高端共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

60石墨黑·柔和

石墨黑#6D84B0

主色#6D84B0
主色浅#A9B6D1
辅色#8C8DBB
强调色#BF9469
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：品牌官网、硬件产品

色相 220°分类 极简高端共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

61云灰白·标准

云灰白#3175B9

主色#3175B9
主色浅#6EA3D8
辅色#546AC5
强调色#269DD9
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：笔记协作、项目管理

色相 210°分类 工具效率共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

62云灰白·浅色

云灰白#729ECA

主色#729ECA
主色浅#B5CCE3
辅色#95A1D0
强调色#45A4D3
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：笔记协作、项目管理

色相 210°分类 工具效率共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

63云灰白·暗色

云灰白#5494D4

主色#5494D4
主色浅#9DC2E7
辅色#3E58C1
强调色#58B5E4
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：笔记协作、项目管理

色相 210°分类 工具效率共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

64云灰白·高饱和

云灰白#1C80E3

主色#1C80E3
主色浅#6EADED
辅色#405FD8
强调色#1DA7ED
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：笔记协作、项目管理

色相 210°分类 工具效率共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

65云灰白·柔和

云灰白#6D8FB0

主色#6D8FB0
主色浅#A9BDD1
辅色#8C95BB
强调色#69A2BF
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：笔记协作、项目管理

色相 210°分类 工具效率共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

66赤陶红·标准

赤陶红#B94331

主色#B94331
主色浅#D87C6E
辅色#C58554
强调色#D96E26
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：文博展览、非遗传承

色相 8°分类 国风文化共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

67赤陶红·浅色

赤陶红#CA7E72

主色#CA7E72
主色浅#E3BBB5
辅色#D0AF95
强调色#D37E45
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：文博展览、非遗传承

色相 8°分类 国风文化共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

68赤陶红·暗色

赤陶红#D46554

主色#D46554
主色浅#E7A79D
辅色#C1773E
强调色#E49058
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：文博展览、非遗传承

色相 8°分类 国风文化共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

69赤陶红·高饱和

赤陶红#E3371C

主色#E3371C
主色浅#ED7F6E
辅色#D88240
强调色#ED701D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：文博展览、非遗传承

色相 8°分类 国风文化共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

70赤陶红·柔和

赤陶红#B0766D

主色#B0766D
主色浅#D1AEA9
辅色#BBA08C
强调色#BF8B69
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：文博展览、非遗传承

色相 8°分类 国风文化共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

71帝王金·标准

帝王金#B99131

主色#B99131
主色浅#D8B86E
辅色#C5C554
强调色#D98026
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：金融会员、尊享服务

色相 42°分类 商务尊享共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

72帝王金·浅色

帝王金#CAB072

主色#CAB072
主色浅#E3D5B5
辅色#D0D095
强调色#D38C45
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：金融会员、尊享服务

色相 42°分类 商务尊享共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

73帝王金·暗色

帝王金#D4AE54

主色#D4AE54
主色浅#E7D09D
辅色#C1C13E
强调色#E49E58
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：金融会员、尊享服务

色相 42°分类 商务尊享共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

74帝王金·高饱和

帝王金#E3A71C

主色#E3A71C
主色浅#EDC76E
辅色#D8D840
强调色#ED851D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：金融会员、尊享服务

色相 42°分类 商务尊享共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

75帝王金·柔和

帝王金#B09C6D

主色#B09C6D
主色浅#D1C5A9
辅色#BBBB8C
强调色#BF9469
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：金融会员、尊享服务

色相 42°分类 商务尊享共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

76苔藓褐·标准

苔藓褐#B97131

主色#B97131
主色浅#D8A06E
辅色#C5AA54
强调色#D95326
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：精品咖啡、手作工坊

色相 28°分类 复古质感共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

77苔藓褐·浅色

苔藓褐#CA9B72

主色#CA9B72
主色浅#E3CAB5
辅色#D0C295
强调色#D36945
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：精品咖啡、手作工坊

色相 28°分类 复古质感共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

78苔藓褐·暗色

苔藓褐#D49054

主色#D49054
主色浅#E7BF9D
辅色#C1A23E
强调色#E47B58
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：精品咖啡、手作工坊

色相 28°分类 复古质感共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

79苔藓褐·高饱和

苔藓褐#E3791C

主色#E3791C
主色浅#EDA96E
辅色#D8B540
强调色#ED511D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：精品咖啡、手作工坊

色相 28°分类 复古质感共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

80苔藓褐·柔和

苔藓褐#B08D6D

主色#B08D6D
主色浅#D1BBA9
辅色#BBB08C
强调色#BF7E69
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：精品咖啡、手作工坊

色相 28°分类 复古质感共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

81青瓷绿·标准

青瓷绿#31B98C

主色#31B98C
主色浅#6ED8B5
辅色#54C5C1
强调色#26D9CA
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：茶道香道、东方美学

色相 160°分类 东方禅意共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

82青瓷绿·浅色

青瓷绿#72CAAD

主色#72CAAD
主色浅#B5E3D4
辅色#95D0CE
强调色#45D3C8
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：茶道香道、东方美学

色相 160°分类 东方禅意共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

83青瓷绿·暗色

青瓷绿#54D4A9

主色#54D4A9
主色浅#9DE7CE
辅色#3EC1BC
强调色#58E4D8
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：茶道香道、东方美学

色相 160°分类 东方禅意共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

84青瓷绿·高饱和

青瓷绿#1CE3A1

主色#1CE3A1
主色浅#6EEDC3
辅色#40D8D3
强调色#1DEDDB
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：茶道香道、东方美学

色相 160°分类 东方禅意共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

85青瓷绿·柔和

青瓷绿#6DB09A

主色#6DB09A
主色浅#A9D1C3
辅色#8CBBB9
强调色#69BFB8
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：茶道香道、东方美学

色相 160°分类 东方禅意共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

86霓虹青·标准

霓虹青#31AEB9

主色#31AEB9
主色浅#6ED0D8
辅色#5499C5
强调色#D9269D
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：潮牌电商、夜店活动

色相 185°分类 潮流酷玩共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

87霓虹青·浅色

霓虹青#72C2CA

主色#72C2CA
主色浅#B5DFE3
辅色#95B9D0
强调色#D345A4
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：潮牌电商、夜店活动

色相 185°分类 潮流酷玩共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

88霓虹青·暗色

霓虹青#54C9D4

主色#54C9D4
主色浅#9DE0E7
辅色#3E8FC1
强调色#E458B5
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：潮牌电商、夜店活动

色相 185°分类 潮流酷玩共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

89霓虹青·高饱和

霓虹青#1CD2E3

主色#1CD2E3
主色浅#6EE2ED
辅色#409ED8
强调色#ED1DA7
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：潮牌电商、夜店活动

色相 185°分类 潮流酷玩共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

90霓虹青·柔和

霓虹青#6DABB0

主色#6DABB0
主色浅#A9CDD1
辅色#8CA9BB
强调色#BF69A2
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：潮牌电商、夜店活动

色相 185°分类 潮流酷玩共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

91宝蓝金·标准

宝蓝金#3153B9

主色#3153B9
主色浅#6E89D8
辅色#5954C5
强调色#D9A326
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：在线网课、早教启蒙

色相 225°分类 教育亲子共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

92宝蓝金·浅色

宝蓝金#7288CA

主色#7288CA
主色浅#B5C1E3
辅色#9895D0
强调色#D3A945
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：在线网课、早教启蒙

色相 225°分类 教育亲子共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

93宝蓝金·暗色

宝蓝金#5474D4

主色#5474D4
主色浅#9DAFE7
辅色#453EC1
强调色#E4BA58
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：在线网课、早教启蒙

色相 225°分类 教育亲子共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

94宝蓝金·高饱和

宝蓝金#1C4EE3

主色#1C4EE3
主色浅#6E8EED
辅色#4840D8
强调色#EDAE1D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：在线网课、早教启蒙

色相 225°分类 教育亲子共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

95宝蓝金·柔和

宝蓝金#6D7EB0

主色#6D7EB0
主色浅#A9B3D1
辅色#8E8CBB
强调色#BFA569
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：在线网课、早教启蒙

色相 225°分类 教育亲子共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

96麦田黄·标准

麦田黄#B99E31

主色#B99E31
主色浅#D8C36E
辅色#BAC554
强调色#71D926
背景#FFFFFF
卡片#F7F8FA
文字#1A1D21
次要文字#6B7280
边框#E6E8EC
成功#30A661
警告#DC9518
危险#DD382C

适合场景：农产直供、粮油品牌

色相 48°分类 农业食品共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

97麦田黄·浅色

麦田黄#CAB872

主色#CAB872
主色浅#E3DAB5
辅色#CAD095
强调色#80D345
背景#FBFCFE
卡片#FFFFFF
文字#2A2F36
次要文字#8A93A0
边框#EAEEF2
成功#30A661
警告#DC9518
危险#DD382C

适合场景：农产直供、粮油品牌

色相 48°分类 农业食品共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

98麦田黄·暗色

麦田黄#D4BA54

主色#D4BA54
主色浅#E7D89D
辅色#B4C13E
强调色#92E458
背景#0F1216
卡片#171B22
文字#E7EBF1
次要文字#9AA4B2
边框#262C36
成功#39C674
警告#DC9518
危险#DD382C

适合场景：农产直供、粮油品牌

色相 48°分类 农业食品共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

99麦田黄·高饱和

麦田黄#E3BB1C

主色#E3BB1C
主色浅#EDD46E
辅色#C9D840
强调色#73ED1D
背景#FFFFFF
卡片#F6F7F9
文字#15181C
次要文字#5E6672
边框#E2E4E8
成功#30A661
警告#DC9518
危险#DD382C

适合场景：农产直供、粮油品牌

色相 48°分类 农业食品共 12 色
COLOR不一样的配色 · 绚丽多彩 —— 配色灵感

100麦田黄·柔和

麦田黄#B0A36D

主色#B0A36D
主色浅#D1C9A9
辅色#B6BB8C
强调色#8DBF69
背景#FCFCFA
卡片#FFFFFF
文字#33383F
次要文字#8C929B
边框#ECEAE6
成功#30A661
警告#DC9518
危险#DD382C

适合场景：农产直供、粮油品牌

色相 48°分类 农业食品共 12 色
每套配色卡片里的 hex 色值、色名、适用场景都写成可读文本（不只藏在 CSS 里），并带 data-category / data-tags 结构化属性，便于筛选与搜索引擎理解。色值由 HSL 算法生成，可商用参考。