主色输入
🔒 全部在浏览器内计算，免注册#4F46E5rgb(79, 70, 229)蓝
rgb(79, 70, 229) · 色系名称: 蓝
互补色
180°点击任一色卡即可将其设为主色
#4F46E5rgb(79, 70, 229)蓝- 对白6.29AA 达标
- 对黑3.34不达标
#9C96F0rgb(156, 150, 240)蓝- 对白2.61不达标
- 对黑8.03AAA 达标
#DCE546rgb(220, 229, 70)黄- 对白1.37不达标
- 对黑15.34AAA 达标
#BAC31Brgb(186, 195, 27)黄- 对白1.92不达标
- 对黑10.91AAA 达标
类比色
±30°点击任一色卡即可将其设为主色
#468CE5rgb(70, 140, 229)蓝- 对白3.42不达标
- 对黑6.14AA 达标
#738AEBrgb(115, 138, 235)蓝- 对白3.20不达标
- 对黑6.56AA 达标
#4F46E5rgb(79, 70, 229)蓝- 对白6.29AA 达标
- 对黑3.34不达标
#9873EBrgb(152, 115, 235)紫- 对白3.51不达标
- 对黑5.99AA 达标
#9F46E5rgb(159, 70, 229)紫- 对白4.69AA 达标
- 对黑4.48不达标
三等分
120°点击任一色卡即可将其设为主色
#4F46E5rgb(79, 70, 229)蓝- 对白6.29AA 达标
- 对黑3.34不达标
#E54F46rgb(229, 79, 70)红- 对白3.79不达标
- 对黑5.54AA 达标
#46E54Frgb(70, 229, 79)绿- 对白1.67不达标
- 对黑12.58AAA 达标
四等分／矩形
90° + 180°点击任一色卡即可将其设为主色
#4F46E5rgb(79, 70, 229)蓝- 对白6.29AA 达标
- 对黑3.34不达标
#E5468Crgb(229, 70, 140)洋红- 对白3.76不达标
- 对黑5.59AA 达标
#DCE546rgb(220, 229, 70)黄- 对白1.37不达标
- 对黑15.34AAA 达标
#46E59Frgb(70, 229, 159)绿- 对白1.62不达标
- 对黑12.97AAA 达标
单色系
H点击任一色卡即可将其设为主色
#DCDBF0rgb(220, 219, 240)蓝- 对白1.36不达标
- 对黑15.43AAA 达标
#9995E5rgb(153, 149, 229)蓝- 对白2.70不达标
- 对黑7.78AAA 达标
#827CEDrgb(130, 124, 237)蓝- 对白3.47不达标
- 对黑6.06AA 达标
#4F46E5rgb(79, 70, 229)蓝- 对白6.29AA 达标
- 对黑3.34不达标
#180EB7rgb(24, 14, 183)蓝- 对白11.76AAA 达标
- 对黑1.79不达标
#0A0470rgb(10, 4, 112)蓝- 对白16.61AAA 达标
- 对黑1.26不达标
明暗预览
共 17 种颜色浅底
示例文字 Aa
深底
示例文字 Aa
对比度检查
示例文字 Aa
对比度为 6.29AA 达标
导出与预览
:root {
--color-1: #4F46E5;
--color-2: #9C96F0;
--color-3: #DCE546;
--color-4: #BAC31B;
--color-5: #468CE5;
--color-6: #738AEB;
--color-7: #9873EB;
--color-8: #9F46E5;
--color-9: #E54F46;
--color-10: #46E54F;
--color-11: #E5468C;
--color-12: #46E59F;
--color-13: #DCDBF0;
--color-14: #9995E5;
--color-15: #827CED;
--color-16: #180EB7;
--color-17: #0A0470;
}