Named color · #E7BCB4
Rose Fog
Rose Fog is #E7BCB4: rgb(231 188 180), hsl(9 52% 81%), oklch(0.831 0.051 30.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Rose Fog color name →
#E7BCB4
oklch(0.831 0.051 30.4)
Color conversions
- HEX
- #e7bcb4
- RGB
- rgb(231 188 180)
- HSL
- hsl(9 52% 81%)
- HWB
- hwb(9 71% 9%)
- OKLCH
- oklch(0.831 0.051 30.4)
- OKLab
- oklab(0.831 0.044 0.026)
- CIE Lab
- lab(79.95 15.03 10.19)
- LCH
- lch(79.95 18.16 34.1)
- CMYK
- cmyk(0% 19% 22% 9%)
Tints · Shades · Tones
Tints
- EAC3BB
- ECC9C3
- EFD0CA
- F1D7D2
- F4DDD9
- F6E4E1
- F8EBE8
- FBF1F0
- FDF8F7
Shades
- C9A39C
- AB8B85
- 8F736E
- 735D58
- 594744
- 403230
- 281F1D
- 130D0C
- 030202
Tones
- DCB6AF
- D2B0A9
- C7AAA4
- BDA49F
- B39E9A
- A89895
- 9E928F
- 948C8A
- 8A8685
Color harmonies
Complementary +180°
- E7BCB4
Rose Fog
- A2D1DA
≈ Cay
Analogous -30° +30°
- E7BCB4
Rose Fog
- E5BAC6
≈ Love in a Mist
- E1C1A7
≈ Strawberry Malt
Triadic +120° +240°
- E7BCB4
Rose Fog
- B1D2B7
≈ Enchanted Meadow
- BBC7EA
≈ Pale Wisteria
Split-complementary +150° +210°
- E7BCB4
Rose Fog
- A4D3C9
≈ Refresh
- ABCDE6
≈ Frosty Snow Cap
Tetradic +90° +180° +270°
- E7BCB4
Rose Fog
- C3CDA8
≈ Baize Green
- A2D1DA
≈ Cay
- CCC1E4
≈ Party Hat
Contrast & accessibility
Ag
FailOn white
WCAG 1.71:1 · APCA Lc 31
Ag
AAAOn black
WCAG 12.25:1 · APCA Lc 72
Best text color: #000000
WCAG 12.25:1 (AAA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--rose-fog: #e7bcb4;
--rose-fog-rgb: 231 188 180;
--rose-fog-oklch: oklch(0.831 0.051 30.4);
}
.element {
color: var(--rose-fog);
background-color: hsl(9 52% 81%);
border-color: oklch(0.831 0.051 30.4);
}Tailwind CSS v4
@theme {
--color-rose-fog: #e7bcb4;
--color-rose-fog-50: #fff0ec;
--color-rose-fog-100: #f8e2dd;
--color-rose-fog-200: #e9cdc7;
--color-rose-fog-300: #d0aea7;
--color-rose-fog-400: #bb948d;
--color-rose-fog-500: #a57a72;
--color-rose-fog-600: #8c6761;
--color-rose-fog-700: #70534d;
--color-rose-fog-800: #533c38;
--color-rose-fog-900: #3a2927;
--color-rose-fog-950: #241715;
}SCSS
$rose-fog: #e7bcb4;
$rose-fog-rgb: 231, 188, 180;
$rose-fog-light: mix(#fff, $rose-fog, 20%);
$rose-fog-dark: mix(#000, $rose-fog, 20%);
.element {
color: $rose-fog;
box-shadow: 0 0 0 2px rgba($rose-fog, 0.35);
}