Nearest named color · #F2C4B9
#F2C4B9
Nearest named color: Rosewood Dreams
#F2C4B9 (rgb(242 196 185), hsl(12 69% 84%), oklch(0.858 0.055 33.7)) is closest to the named color Rosewood Dreams. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#F2C4B9
oklch(0.858 0.055 33.7)
Color conversions
- HEX
- #f2c4b9
- RGB
- rgb(242 196 185)
- HSL
- hsl(12 69% 84%)
- HWB
- hwb(12 73% 5%)
- OKLCH
- oklch(0.858 0.055 33.7)
- OKLab
- oklab(0.858 0.046 0.031)
- CIE Lab
- lab(83.06 15.71 12.07)
- LCH
- lch(83.06 19.81 37.5)
- CMYK
- cmyk(0% 19% 24% 5%)
Tints · Shades · Tones
Tints
- F4CAC0
- F5D0C7
- F7D6CE
- F8DCD5
- F9E1DC
- FBE7E3
- FCEDEA
- FDF3F1
- FEF9F8
Shades
- D2AAA0
- B49189
- 967871
- 79615B
- 5E4A46
- 433531
- 2B211E
- 140E0D
- 030202
Tones
- E6BDB3
- DAB6AD
- CFAFA8
- C3A8A2
- B8A29C
- AD9B96
- A19491
- 968D8B
- 8B8786
Color harmonies
Complementary +180°
- F2C4B9
Rosewood Dreams
- A7DAE6
≈ Havana Blue
Analogous -30° +30°
- F2C4B9
Rosewood Dreams
- F1C2CC
≈ Azalea Flower
- EBC9AB
≈ Almond Biscuit
Triadic +120° +240°
- F2C4B9
Rosewood Dreams
- B5DBC0
≈ Ice Mist
- C4CEF5
≈ Miami White
Split-complementary +150° +210°
- F2C4B9
Rosewood Dreams
- A8DDD4
≈ Sparkling Mint
- B2D5F2
≈ Blue Rice
Tetradic +90° +180° +270°
- F2C4B9
Rosewood Dreams
- C9D7B0
≈ Chinese Leaf
- A7DAE6
≈ Havana Blue
- D8C8EE
≈ Foggy Love
Contrast & accessibility
Ag
FailOn white
WCAG 1.57:1 · APCA Lc 26
Ag
AAAOn black
WCAG 13.37:1 · APCA Lc 77
Best text color: #000000
WCAG 13.37:1 (AAA) · APCA Lc 77
Contrast pairs
Code snippets
CSS
:root {
--rosewood-dreams: #f2c4b9;
--rosewood-dreams-rgb: 242 196 185;
--rosewood-dreams-oklch: oklch(0.858 0.055 33.7);
}
.element {
color: var(--rosewood-dreams);
background-color: hsl(12 69% 84%);
border-color: oklch(0.858 0.055 33.7);
}Tailwind CSS v4
@theme {
--color-rosewood-dreams: #f2c4b9;
--color-rosewood-dreams-50: #fff0eb;
--color-rosewood-dreams-100: #fae2dc;
--color-rosewood-dreams-200: #ebcdc4;
--color-rosewood-dreams-300: #d2aea4;
--color-rosewood-dreams-400: #bd9389;
--color-rosewood-dreams-500: #a7796e;
--color-rosewood-dreams-600: #8d675e;
--color-rosewood-dreams-700: #71524b;
--color-rosewood-dreams-800: #543b37;
--color-rosewood-dreams-900: #3a2925;
--color-rosewood-dreams-950: #241714;
}SCSS
$rosewood-dreams: #f2c4b9;
$rosewood-dreams-rgb: 242, 196, 185;
$rosewood-dreams-light: mix(#fff, $rosewood-dreams, 20%);
$rosewood-dreams-dark: mix(#000, $rosewood-dreams, 20%);
.element {
color: $rosewood-dreams;
box-shadow: 0 0 0 2px rgba($rosewood-dreams, 0.35);
}