Nearest named color · #F8A19B
#F8A19B
Nearest named color: Young Crab
#F8A19B (rgb(248 161 155), hsl(4 87% 79%), oklch(0.794 0.105 24)) is closest to the named color Young Crab. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#F8A19B
oklch(0.794 0.105 24)
Color conversions
- HEX
- #f8a19b
- RGB
- rgb(248 161 155)
- HSL
- hsl(4 87% 79%)
- HWB
- hwb(4 61% 3%)
- OKLCH
- oklch(0.794 0.105 24)
- OKLab
- oklab(0.794 0.096 0.043)
- CIE Lab
- lab(75.09 32.68 17.26)
- LCH
- lch(75.09 36.96 27.8)
- CMYK
- cmyk(0% 35% 38% 3%)
Tints · Shades · Tones
Tints
- FAABA5
- FBB4AF
- FCBEB8
- FDC7C2
- FED0CC
- FFDAD6
- FFE3E0
- FFECEB
- FFF6F5
Shades
- D88B86
- B87672
- 9A625E
- 7C4E4B
- 603C39
- 452A28
- 2C1918
- 150909
- 030101
Tones
- EC9E98
- E09B96
- D49893
- C89590
- BC918E
- B08E8B
- A48B88
- 988786
- 8C8483
Color harmonies
Complementary +180°
- F8A19B
Young Crab
- 5CCFDB
≈ Blue Radiance
Analogous -30° +30°
- F8A19B
Young Crab
- F1A0C0
≈ Prism Pink
- F1A97A
≈ Hazelnut Milk
Triadic +120° +240°
- F8A19B
Young Crab
- 92CE91
≈ Fennel
- 9ABBFF
≈ Truesky Gloxym
Split-complementary +150° +210°
- F8A19B
Young Crab
- 6BD2B7
≈ Sweet Garden
- 73C7F5
≈ Nevermind Nirvana
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.98:1 · APCA Lc 38
Ag
AAAOn black
WCAG 10.56:1 · APCA Lc 64
Best text color: #000000
WCAG 10.56:1 (AAA) · APCA Lc 64
Contrast pairs
Code snippets
CSS
:root {
--young-crab: #f8a19b;
--young-crab-rgb: 248 161 155;
--young-crab-oklch: oklch(0.794 0.105 24);
}
.element {
color: var(--young-crab);
background-color: hsl(4 87% 79%);
border-color: oklch(0.794 0.105 24);
}Tailwind CSS v4
@theme {
--color-young-crab: #f8a19b;
--color-young-crab-50: #ffeae6;
--color-young-crab-100: #ffdbd6;
--color-young-crab-200: #fec4bd;
--color-young-crab-300: #e8a39b;
--color-young-crab-400: #d58580;
--color-young-crab-500: #c26864;
--color-young-crab-600: #a45955;
--color-young-crab-700: #844743;
--color-young-crab-800: #623332;
--color-young-crab-900: #452222;
--color-young-crab-950: #2c1111;
}SCSS
$young-crab: #f8a19b;
$young-crab-rgb: 248, 161, 155;
$young-crab-light: mix(#fff, $young-crab, 20%);
$young-crab-dark: mix(#000, $young-crab, 20%);
.element {
color: $young-crab;
box-shadow: 0 0 0 2px rgba($young-crab, 0.35);
}