Named color · #FFA180
Orchid Orange
Orchid Orange is #FFA180: rgb(255 161 128), hsl(16 100% 75%), oklch(0.797 0.121 40.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Orchid Orange color name →
#FFA180
oklch(0.797 0.121 40.1)
Color conversions
- HEX
- #ffa180
- RGB
- rgb(255 161 128)
- HSL
- hsl(16 100% 75%)
- HWB
- hwb(16 50% 0%)
- OKLCH
- oklch(0.797 0.121 40.1)
- OKLab
- oklab(0.797 0.093 0.078)
- CIE Lab
- lab(75.52 33.38 32.54)
- LCH
- lch(75.52 46.61 44.3)
- CMYK
- cmyk(0% 37% 50% 0%)
Tints · Shades · Tones
Tints
- FFAB8D
- FFB49A
- FFBEA6
- FFC7B3
- FFD1C0
- FFDACC
- FFE3D9
- FFEDE6
- FFF6F2
Shades
- DE8B6E
- BE765D
- 9E624D
- 804E3D
- 633C2E
- 482A1F
- 2E1912
- 160906
- 030101
Tones
- F29E81
- E69B81
- D99881
- CC9582
- C09282
- B38E82
- A68B81
- 9A8781
- 8D8481
Color harmonies
Complementary +180°
- FFA180
Orchid Orange
- 4ECEF2
≈ Thor’s Thunder
Analogous -30° +30°
- FFA180
Orchid Orange
- FF9BAB
≈ Salmon Tartare
- EEAE60
≈ Goldfish
Triadic +120° +240°
- FFA180
Orchid Orange
- 6FD5A2
≈ Tadorna Teal
- AFB5FF
≈ Greyish Lavender
Split-complementary +150° +210°
- FFA180
Orchid Orange
- 43D5CE
≈ Medium Turquoise
- 87C2FF
≈ Scenic Water
Tetradic +90° +180° +270°
- FFA180
Orchid Orange
- A3CC77
≈ Lick of Lime
- 4ECEF2
≈ Thor’s Thunder
- D5A6F7
≈ Purple Hepatica
Contrast & accessibility
Ag
FailOn white
WCAG 1.96:1 · APCA Lc 38
Ag
AAAOn black
WCAG 10.66:1 · APCA Lc 65
Best text color: #000000
WCAG 10.66:1 (AAA) · APCA Lc 65
Contrast pairs
Code snippets
CSS
:root {
--orchid-orange: #ffa180;
--orchid-orange-rgb: 255 161 128;
--orchid-orange-oklch: oklch(0.797 0.121 40.1);
}
.element {
color: var(--orchid-orange);
background-color: hsl(16 100% 75%);
border-color: oklch(0.797 0.121 40.1);
}Tailwind CSS v4
@theme {
--color-orchid-orange: #ffa180;
--color-orchid-orange-50: #ffebda;
--color-orchid-orange-100: #ffdbc9;
--color-orchid-orange-200: #ffc4ac;
--color-orchid-orange-300: #eda386;
--color-orchid-orange-400: #db8566;
--color-orchid-orange-500: #c86744;
--color-orchid-orange-600: #a9573a;
--color-orchid-orange-700: #88462e;
--color-orchid-orange-800: #653222;
--color-orchid-orange-900: #472216;
--color-orchid-orange-950: #2e1107;
}SCSS
$orchid-orange: #ffa180;
$orchid-orange-rgb: 255, 161, 128;
$orchid-orange-light: mix(#fff, $orchid-orange, 20%);
$orchid-orange-dark: mix(#000, $orchid-orange, 20%);
.element {
color: $orchid-orange;
box-shadow: 0 0 0 2px rgba($orchid-orange, 0.35);
}