Nearest named color · #F7A0B9
#F7A0B9
Nearest named color: Prism Pink
#F7A0B9 (rgb(247 160 185), hsl(343 84% 80%), oklch(0.799 0.107 1.1)) is closest to the named color Prism Pink. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#F7A0B9
oklch(0.799 0.107 1.1)
Color conversions
- HEX
- #f7a0b9
- RGB
- rgb(247 160 185)
- HSL
- hsl(343 84% 80%)
- HWB
- hwb(343 63% 3%)
- OKLCH
- oklch(0.799 0.107 1.1)
- OKLab
- oklab(0.799 0.107 0.002)
- CIE Lab
- lab(75.35 35.56 1.24)
- LCH
- lch(75.35 35.58 2)
- CMYK
- cmyk(0% 35% 25% 3%)
Tints · Shades · Tones
Tints
- F9AAC0
- FAB3C7
- FCBDCE
- FDC6D4
- FED0DB
- FED9E2
- FFE3EA
- FFECF1
- FFF6F8
Shades
- D78BA0
- B77689
- 996171
- 7C4E5B
- 603B46
- 452931
- 2C191E
- 15090D
- 030102
Tones
- EB9DB3
- DF9AAD
- D397A8
- C794A2
- BC919C
- B08E96
- A48A91
- 98878B
- 8C8386
Color harmonies
Complementary +180°
- F7A0B9
Prism Pink
- 63D4C1
≈ Jamaican Jade
Analogous -30° +30°
- F7A0B9
Prism Pink
- E6A4DD
≈ Candy Floss
- FBA393
≈ Coral Serenade
Triadic +120° +240°
- F7A0B9
Prism Pink
- B3C878
≈ Sour Face
- 7BC6FC
≈ Nevermind Nirvana
Split-complementary +150° +210°
- F7A0B9
Prism Pink
- 88D19A
≈ Fennel
- 5DD0E5
≈ Slick Blue
Tetradic +90° +180° +270°
- F7A0B9
Prism Pink
- D7BB69
≈ Tookie Bird
- 63D4C1
≈ Jamaican Jade
- A5BAFF
≈ Pastel Blue
Contrast & accessibility
Ag
FailOn white
WCAG 1.96:1 · APCA Lc 38
Ag
AAAOn black
WCAG 10.68:1 · APCA Lc 65
Best text color: #000000
WCAG 10.68:1 (AAA) · APCA Lc 65
Contrast pairs
Code snippets
CSS
:root {
--prism-pink: #f7a0b9;
--prism-pink-rgb: 247 160 185;
--prism-pink-oklch: oklch(0.799 0.107 1.1);
}
.element {
color: var(--prism-pink);
background-color: hsl(343 84% 80%);
border-color: oklch(0.799 0.107 1.1);
}Tailwind CSS v4
@theme {
--color-prism-pink: #f7a0b9;
--color-prism-pink-50: #ffe9f2;
--color-prism-pink-100: #ffdae4;
--color-prism-pink-200: #fdc2d0;
--color-prism-pink-300: #e7a1b2;
--color-prism-pink-400: #d3839a;
--color-prism-pink-500: #bf6682;
--color-prism-pink-600: #a1566e;
--color-prism-pink-700: #824558;
--color-prism-pink-800: #603241;
--color-prism-pink-900: #43222d;
--color-prism-pink-950: #2b111a;
}SCSS
$prism-pink: #f7a0b9;
$prism-pink-rgb: 247, 160, 185;
$prism-pink-light: mix(#fff, $prism-pink, 20%);
$prism-pink-dark: mix(#000, $prism-pink, 20%);
.element {
color: $prism-pink;
box-shadow: 0 0 0 2px rgba($prism-pink, 0.35);
}