当前颜色 · 近似色名:桃
#FFF1A8
色相 H50.34
饱和度 S99.99%
亮度 L82.94%
🕘 最近使用的颜色
选色 / 取色后自动记录,最多 20 条
⭐ 我的收藏
点击色块可查看详情,再次点击收藏按钮可取消
🗂️ 收藏成组管理
🎯 WCAG 对比度检查
Aa 白字
对比度 -- : 1
计算中
Aa 黑字
对比度 -- : 1
计算中
亮度参考(黑 ← 当前色 → 白)
🦯 色盲模拟(无障碍预览)
正常视觉
#FFF1A8
红绿色盲
-
红色盲
-
蓝色盲
-
模拟色觉缺陷下当前颜色的近似呈现,帮助设计高可读性配色。
🖼️ 图片取色器(点击任意位置取色 · 悬停显示放大镜)
点击或拖拽图片 → 上传后点击图片任意位置取色
支持:点击取色 + 放大镜精取 + 实时色值 + 一键跳转
🎯 实时颜色效果演示
导航栏颜色
卡片背景色
按钮颜色
边框/文字颜色
文字与边框
🌈 CSS 渐变生成器
类型
角度 135°
起止颜色
→
background:linear-gradient(135deg, #FFF1A8, #fff5c2);
预置搭配: · · ·
渐变预设(点击应用):
🎨 随机配色方案生成
/* 生成的CSS代码 */
color: #FFF1A8;
background-color: #FFF1A8;
border-color: #FFF1A8;
/* 渐变背景 */
background: linear-gradient(135deg, #FFF1A8 0%, #fff2b0 100%);
/* 导航颜色 */
.header{ background-color: #FFF1A8; color:#ffffff; }
/* 卡片背景 + 边框 */
.card{ background-color: #FFF1A80a; border:1px solid #FFF1A825; }
/* 文字 / 边框颜色 */
.text-border{ color:#FFF1A8; border-color:#FFF1A8; }
/* 按钮样式 */
.btn{ background-color:#FFF1A8; color:#ffffff; padding:6px 14px; border-radius:4px; border:none; }
.btn:hover{ opacity:0.9; }
颜色代码合集
十六进制: #FFF1A8
近似色名: 桃
RGB: rgb(255,241,168)
RGB 百分比: 100% / 94.5% / 65.9%
十进制: 255 / 241 / 168
CMYK: 0% / 5.5% / 34.1% / 0% (已修正K)
CMY: 0% / 5.5% / 34.1%
CIE-LAB: L 94.7 / a -5.7 / b 37
LCH: L 94.74 / C 37.44 / H 98.75°
YIQ: 236.86
YUV: 236.86 / -33.89 / 15.91
网页安全色: #ffff99
颜色反转
灰度 / 互补色
💼 品牌色速查(知名品牌主色)
微信#07c160支付宝#1677ff淘宝#ff5000京东#e1251b百度#2932e1美团#ffbb00滴滴#ff4d4d抖音#ff3a3a微博#e6162d知乎#0084ffB站#fb7299爱奇艺#00cf87腾讯#0052d9网易#c20c0cFacebook#1877f2Twitter#1d9bf0Google#4285f4YouTube#ff0000
热门品牌主色直达色卡,覆盖“品牌色”搜索长尾词。
🎯 配色用途直达(按场景选色)
按设计场景直达常用配色,覆盖"商务配色""清新配色"等搜索长尾词。
🔍 颜色快速搜索
回车或点击「直达」跳转到对应颜色的详情页(站内链接)。
🎡 色环与色彩关系
基于色环,当前色可衍生出以下配色关系:
🔗 颜色格式互转 & 相关色延伸
以上为站内内部链接,方便蜘蛛抓取并形成内链权重传递。
🧩 相近色实时推荐(随当前色联动)
基于当前色自动生成色相 / 明度微调的相近色,点击直达对应色卡。
⚖️ 双色对比工具
颜色 A(前景 / 背景)
#FFF1A8
颜色 B
#fff5c2
AB 对比
对比度 -- : 1
计算中
可拖动上方色块对比,判断两色搭配的对比度与可读性。
🗃️ 对比分组合并
🎨 配色方案
为用户提供丰富多样的颜色搭配灵感,帮助用户在各个领域中实现理想的视觉效果。
🧑🎨 渐变配色应用实例
🌈 三色渐变生成器
起 · 中 · 止颜色
→
→
background:linear-gradient(90deg, #FFF1A8, #fff5c2, #ccc086);
·
·
🏮 中国传统色速查(24 色)
朱砂
#E34234胭脂
#9D2933绛紫
#8B4352黛蓝
#3B4F6F竹青
#789262松花绿
#057748柳绿
#AFDD22葱青
#0EB83A杏黄
#E8A33D鹅黄
#FFF176明黄
#FFD400缃色
#F0C239月白
#D6ECF0天青
#A0D2DB黛色
#4A4266藕荷
#E4C6D0豆青
#9ED8DB蟹壳青
#7C9C95赭石
#9B4400棕色
#8B4513玄色
#111111银白
#E9E7E8玉色
#D6E2DB雪白
#F0F4F0
#E34234胭脂
#9D2933绛紫
#8B4352黛蓝
#3B4F6F竹青
#789262松花绿
#057748柳绿
#AFDD22葱青
#0EB83A杏黄
#E8A33D鹅黄
#FFF176明黄
#FFD400缃色
#F0C239月白
#D6ECF0天青
#A0D2DB黛色
#4A4266藕荷
#E4C6D0豆青
#9ED8DB蟹壳青
#7C9C95赭石
#9B4400棕色
#8B4513玄色
#111111银白
#E9E7E8玉色
#D6E2DB雪白
#F0F4F0
精选传统色,点击直达对应色卡,适用于中国风设计、文创、品牌配色。
🌡️ 色温冷暖与色彩属性
色温
暖色
明度
极亮(82.94%)
饱和度
中饱和(34.12%)
搭配建议
暖色营造温暖、热情、活力,适合餐饮、促销、社交场景
🧁 柔和色板(马卡龙 & 莫兰迪)
低饱和柔和配色,点击直达色卡,适用于马卡龙/莫兰迪风格设计。
🧭 渐变方向变体(8 方向)
基于渐变生成器的起止色,一键生成 8 个方向的渐变并复制。
🎨 亮/暗主题色板生成器(基于当前色)
🎯 颜色相似度对比
颜色 A
#FFF1A8
颜色 B
#fff5c2
🏯 更多风格色板(日本传统色 & 北欧色)
日本传统色
点击直达对应色卡,适用于日式、北欧、极简风格设计。
🌑 CSS 阴影生成器(基于当前色)
🔘 按钮状态配色生成器
🎚️ 透明度调节工具(基于当前色)
透明度
100%
📝 常用文字配色速查(高对比)
🖌️ 渐变边框 / 文字渐变生成器
📊 对比度批量测试(当前色 vs 常用背景)
🎲 批量随机颜色生成器
📦 当前色全套代码导出
把当前色的全部色值打包成 JSON 或 CSS 变量文件下载。