Named color · #F4BB92
Copper Cloud
Copper Cloud is #F4BB92: rgb(244 187 146), hsl(25 82% 76%), oklch(0.834 0.086 57). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Copper Cloud color name →
#F4BB92
oklch(0.834 0.086 57)
Color conversions
- HEX
- #f4bb92
- RGB
- rgb(244 187 146)
- HSL
- hsl(25 82% 76%)
- HWB
- hwb(25 57% 4%)
- OKLCH
- oklch(0.834 0.086 57)
- OKLab
- oklab(0.834 0.047 0.072)
- CIE Lab
- lab(80.46 17.41 29.15)
- LCH
- lch(80.46 33.95 59.2)
- CMYK
- cmyk(0% 23% 40% 4%)
Tints · Shades · Tones
Tints
- F6C29D
- F7C9A8
- F8D0B3
- FAD6BE
- FBDDC9
- FCE4D4
- FDEBDE
- FEF1E9
- FEF8F4
Shades
- D4A27E
- B58A6B
- 977358
- 7A5C46
- 5E4635
- 443225
- 2B1F16
- 140D08
- 030201
Tones
- E8B591
- DCAF8F
- D0A98E
- C5A38C
- B99D8A
- AE9888
- A29286
- 978C84
- 8B8682
Color harmonies
Complementary +180°
- F4BB92
Copper Cloud
- 92D2FA
≈ Long Island Sound
Analogous -30° +30°
- F4BB92
Copper Cloud
- FCB4AB
≈ Peach Bud
- E1C688
≈ 24 Karat
Triadic +120° +240°
- F4BB92
Copper Cloud
- 89DBC7
≈ Riptide
- CEBDFA
≈ Lavender Tonic
Split-complementary +150° +210°
- F4BB92
Copper Cloud
- 82D9E5
≈ Medium Sky Blue
- B1C8FF
≈ Night Snow
Tetradic +90° +180° +270°
- F4BB92
Copper Cloud
- A4D8A9
≈ Green Trance
- 92D2FA
≈ Long Island Sound
- E7B6E6
≈ Pink Drink
Contrast & accessibility
Ag
FailOn white
WCAG 1.69:1 · APCA Lc 30
Ag
AAAOn black
WCAG 12.36:1 · APCA Lc 73
Best text color: #000000
WCAG 12.36:1 (AAA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--copper-cloud: #f4bb92;
--copper-cloud-rgb: 244 187 146;
--copper-cloud-oklch: oklch(0.834 0.086 57);
}
.element {
color: var(--copper-cloud);
background-color: hsl(25 82% 76%);
border-color: oklch(0.834 0.086 57);
}Tailwind CSS v4
@theme {
--color-copper-cloud: #f4bb92;
--color-copper-cloud-50: #fff0de;
--color-copper-cloud-100: #fee2cc;
--color-copper-cloud-200: #f1ccb1;
--color-copper-cloud-300: #d9ad8c;
--color-copper-cloud-400: #c5926c;
--color-copper-cloud-500: #b1774b;
--color-copper-cloud-600: #966540;
--color-copper-cloud-700: #785133;
--color-copper-cloud-800: #593a25;
--color-copper-cloud-900: #3e2818;
--color-copper-cloud-950: #281609;
}SCSS
$copper-cloud: #f4bb92;
$copper-cloud-rgb: 244, 187, 146;
$copper-cloud-light: mix(#fff, $copper-cloud, 20%);
$copper-cloud-dark: mix(#000, $copper-cloud, 20%);
.element {
color: $copper-cloud;
box-shadow: 0 0 0 2px rgba($copper-cloud, 0.35);
}