命名颜色 · #F1BA55
Bee
Bee 即 #F1BA55:rgb(241 186 85)、hsl(39 85% 64%)、oklch(0.82 0.133 80.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Bee color name →
#F1BA55
oklch(0.82 0.133 80.2)
颜色转换
- HEX
- #f1ba55
- RGB
- rgb(241 186 85)
- HSL
- hsl(39 85% 64%)
- HWB
- hwb(39 33% 5%)
- OKLCH
- oklch(0.82 0.133 80.2)
- OKLab
- oklab(0.82 0.023 0.131)
- CIE Lab
- lab(79.23 12.98 57.63)
- LCH
- lch(79.23 59.07 77.3)
- CMYK
- cmyk(0% 23% 65% 5%)
浅色调 · 深色调 · 灰色调
浅色调
- F3C16A
- F4C87D
- F6CF8E
- F7D69F
- F9DDB0
- FAE4C0
- FCEBD0
- FDF2E0
- FEF8EF
深色调
- D2A149
- B3893D
- 957231
- 795C26
- 5D461C
- 433211
- 2B1E08
- 140D02
- 030200
灰色调
- E5B45D
- DAAF63
- CEA969
- C3A36E
- B79D72
- AC9876
- A19279
- 968C7C
- 8B867E
配色和谐
互补色 +180°
- F1BA55
Bee
- A2C6FF
≈ Apocyan
类似色 -30° +30°
三角配色 +120° +240°
分裂互补色 +150° +210°
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.76:1 · APCA Lc 32
Ag
AAA黑底
WCAG 11.89:1 · APCA Lc 70
最佳文字颜色: #000000
WCAG 11.89:1 (AAA) · APCA Lc 70
Contrast pairs
代码片段
CSS
:root {
--bee: #f1ba55;
--bee-rgb: 241 186 85;
--bee-oklch: oklch(0.82 0.133 80.2);
}
.element {
color: var(--bee);
background-color: hsl(39 85% 64%);
border-color: oklch(0.82 0.133 80.2);
}Tailwind CSS v4
@theme {
--color-bee: #f1ba55;
--color-bee-50: #fff2cb;
--color-bee-100: #fee4b6;
--color-bee-200: #f1cf92;
--color-bee-300: #d9b164;
--color-bee-400: #c79532;
--color-bee-500: #b37a00;
--color-bee-600: #976700;
--color-bee-700: #795200;
--color-bee-800: #5b3b00;
--color-bee-900: #402900;
--color-bee-950: #291600;
}SCSS
$bee: #f1ba55;
$bee-rgb: 241, 186, 85;
$bee-light: mix(#fff, $bee, 20%);
$bee-dark: mix(#000, $bee, 20%);
.element {
color: $bee;
box-shadow: 0 0 0 2px rgba($bee, 0.35);
}