Named color · #F1BA55
Bee
Bee is #F1BA55: rgb(241 186 85), hsl(39 85% 64%), oklch(0.82 0.133 80.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Bee color name →
#F1BA55
oklch(0.82 0.133 80.2)
Color conversions
- 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%)
Tints · Shades · Tones
Tints
- F3C16A
- F4C87D
- F6CF8E
- F7D69F
- F9DDB0
- FAE4C0
- FCEBD0
- FDF2E0
- FEF8EF
Shades
- D2A149
- B3893D
- 957231
- 795C26
- 5D461C
- 433211
- 2B1E08
- 140D02
- 030200
Tones
- E5B45D
- DAAF63
- CEA969
- C3A36E
- B79D72
- AC9876
- A19279
- 968C7C
- 8B867E
Color harmonies
Complementary +180°
- F1BA55
Bee
- A2C6FF
≈ Apocyan
Analogous -30° +30°
Triadic +120° +240°
Split-complementary +150° +210°
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.76:1 · APCA Lc 32
Ag
AAAOn black
WCAG 11.89:1 · APCA Lc 70
Best text color: #000000
WCAG 11.89:1 (AAA) · APCA Lc 70
Contrast pairs
Code snippets
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);
}