Nearest named color · #DE72CB
#DE72CB
Nearest named color: Pink Orchid
#DE72CB (rgb(222 114 203), hsl(311 62% 66%), oklch(0.705 0.171 334.2)) is closest to the named color Pink Orchid. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#DE72CB
oklch(0.705 0.171 334.2)
Color conversions
- HEX
- #de72cb
- RGB
- rgb(222 114 203)
- HSL
- hsl(311 62% 66%)
- HWB
- hwb(311 45% 13%)
- OKLCH
- oklch(0.705 0.171 334.2)
- OKLab
- oklab(0.705 0.154 -0.074)
- CIE Lab
- lab(63.29 51.38 -27.06)
- LCH
- lch(63.29 58.07 332.2)
- CMYK
- cmyk(0% 49% 9% 13%)
Tints · Shades · Tones
Tints
- E381D0
- E790D6
- EB9EDB
- EFACE0
- F2BAE6
- F5C8EB
- F8D6F0
- FBE3F5
- FDF1FA
Shades
- C162B0
- A55396
- 89447D
- 6F3665
- 55284D
- 3D1B37
- 260E22
- 12040F
- 020102
Tones
- D575C3
- CC77BC
- C379B4
- BA7BAD
- B07CA5
- A77D9E
- 9E7E96
- 947F8F
- 8A8087
Color harmonies
Complementary +180°
- DE72CB
Pink Orchid
- 1ABE6D
≈ Times Square Screens
Analogous -30° +30°
- DE72CB
Pink Orchid
- B881F5
≈ Lilac Geode
- F46B93
≈ God’s Own Junkyard Pink
Triadic +120° +240°
- DE72CB
Pink Orchid
- BD9D00
≈ Perennial
- 00B3CF
≈ Aquarius
Split-complementary +150° +210°
- DE72CB
Pink Orchid
- 8AB112
≈ Brilliant Green
- 00B9A9
≈ Verditer
Tetradic +90° +180° +270°
- DE72CB
Pink Orchid
- E38700
≈ Fulvous
- 1ABE6D
≈ Times Square Screens
- 20A8FF
≈ Protoss Pylon
Contrast & accessibility
Ag
FailOn white
WCAG 2.84:1 · APCA Lc 54
Ag
AAAOn black
WCAG 7.37:1 · APCA Lc 48
Best text color: #000000
WCAG 7.37:1 (AAA) · APCA Lc 48
Contrast pairs
Code snippets
CSS
:root {
--pink-orchid: #de72cb;
--pink-orchid-rgb: 222 114 203;
--pink-orchid-oklch: oklch(0.705 0.171 334.2);
}
.element {
color: var(--pink-orchid);
background-color: hsl(311 62% 66%);
border-color: oklch(0.705 0.171 334.2);
}Tailwind CSS v4
@theme {
--color-pink-orchid: #de72cb;
--color-pink-orchid-50: #ffe3ff;
--color-pink-orchid-100: #ffd3fe;
--color-pink-orchid-200: #ffb8f0;
--color-pink-orchid-300: #ee94d8;
--color-pink-orchid-400: #da73c7;
--color-pink-orchid-500: #c650b4;
--color-pink-orchid-600: #a74598;
--color-pink-orchid-700: #87377a;
--color-pink-orchid-800: #63275c;
--color-pink-orchid-900: #451a40;
--color-pink-orchid-950: #2d0a29;
}SCSS
$pink-orchid: #de72cb;
$pink-orchid-rgb: 222, 114, 203;
$pink-orchid-light: mix(#fff, $pink-orchid, 20%);
$pink-orchid-dark: mix(#000, $pink-orchid, 20%);
.element {
color: $pink-orchid;
box-shadow: 0 0 0 2px rgba($pink-orchid, 0.35);
}