Nearest named color · #FD62AA
#FD62AA
Nearest named color: Fugitive Flamingo
#FD62AA (rgb(253 98 170), hsl(332 97% 69%), oklch(0.714 0.2 354.5)) is closest to the named color Fugitive Flamingo. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#FD62AA
oklch(0.714 0.2 354.5)
Color conversions
- HEX
- #fd62aa
- RGB
- rgb(253 98 170)
- HSL
- hsl(332 97% 69%)
- HWB
- hwb(332 38% 1%)
- OKLCH
- oklch(0.714 0.2 354.5)
- OKLab
- oklab(0.714 0.2 -0.019)
- CIE Lab
- lab(64.2 64.62 -6.44)
- LCH
- lch(64.2 64.94 354.3)
- CMYK
- cmyk(0% 61% 33% 1%)
Tints · Shades · Tones
Tints
- FF74B2
- FF85BB
- FF96C3
- FFA5CB
- FFB5D4
- FFC4DC
- FFD3E5
- FFE2EE
- FFF0F6
Shades
- DC5493
- BC477D
- 9D3A68
- 7F2D53
- 62213F
- 47162D
- 2D0B1B
- 16030B
- 030001
Tones
- F168A6
- E56CA1
- DA709D
- CE7499
- C17795
- B57991
- A87C8C
- 9B7D88
- 8E7F84
Color harmonies
Complementary +180°
- FD62AA
Fugitive Flamingo
- 00BE9D
≈ First Post
Analogous -30° +30°
- FD62AA
Fugitive Flamingo
- DE6FE7
≈ Pink Bonnet
- FF6D68
≈ Pastel Red
Triadic +120° +240°
- FD62AA
Fugitive Flamingo
- A1AD00
≈ Marker Green
- 00B0F2
≈ Democrat
Split-complementary +150° +210°
- FD62AA
Fugitive Flamingo
- 39C147
≈ Lǜ Sè Green
- 00B8C6
≈ Lago Blue
Tetradic +90° +180° +270°
- FD62AA
Fugitive Flamingo
- CD9A00
≈ Vivid Amber
- 00BE9D
≈ First Post
- 749FFF
≈ Fennel Flower
Contrast & accessibility
Ag
FailOn white
WCAG 2.79:1 · APCA Lc 53
Ag
AAAOn black
WCAG 7.50:1 · APCA Lc 49
Best text color: #000000
WCAG 7.50:1 (AAA) · APCA Lc 49
Contrast pairs
Code snippets
CSS
:root {
--fugitive-flamingo: #fd62aa;
--fugitive-flamingo-rgb: 253 98 170;
--fugitive-flamingo-oklch: oklch(0.714 0.2 354.5);
}
.element {
color: var(--fugitive-flamingo);
background-color: hsl(332 97% 69%);
border-color: oklch(0.714 0.2 354.5);
}Tailwind CSS v4
@theme {
--color-fugitive-flamingo: #fd62aa;
--color-fugitive-flamingo-50: #ffdef6;
--color-fugitive-flamingo-100: #ffcce9;
--color-fugitive-flamingo-200: #ffafd6;
--color-fugitive-flamingo-300: #ff88ba;
--color-fugitive-flamingo-400: #f462a5;
--color-fugitive-flamingo-500: #e2348e;
--color-fugitive-flamingo-600: #bf2f78;
--color-fugitive-flamingo-700: #9a2560;
--color-fugitive-flamingo-800: #721a49;
--color-fugitive-flamingo-900: #501132;
--color-fugitive-flamingo-950: #35021e;
}SCSS
$fugitive-flamingo: #fd62aa;
$fugitive-flamingo-rgb: 253, 98, 170;
$fugitive-flamingo-light: mix(#fff, $fugitive-flamingo, 20%);
$fugitive-flamingo-dark: mix(#000, $fugitive-flamingo, 20%);
.element {
color: $fugitive-flamingo;
box-shadow: 0 0 0 2px rgba($fugitive-flamingo, 0.35);
}