Named color · #FFA8A6
Upstream Salmon
Upstream Salmon is #FFA8A6: rgb(255 168 166), hsl(1 100% 83%), oklch(0.816 0.103 21). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Upstream Salmon color name →
#FFA8A6
oklch(0.816 0.103 21)
Color conversions
- HEX
- #ffa8a6
- RGB
- rgb(255 168 166)
- HSL
- hsl(1 100% 83%)
- HWB
- hwb(1 65% 0%)
- OKLCH
- oklch(0.816 0.103 21)
- OKLab
- oklab(0.816 0.096 0.037)
- CIE Lab
- lab(77.66 32.77 14.99)
- LCH
- lch(77.66 36.04 24.6)
- CMYK
- cmyk(0% 34% 35% 0%)
Tints · Shades · Tones
Tints
- FFB1AF
- FFBAB7
- FFC2C0
- FFCBC9
- FFD4D2
- FFDDDB
- FFE5E4
- FFEEED
- FFF6F6
Shades
- DE9290
- BE7C7A
- 9E6765
- 805251
- 633F3E
- 482C2B
- 2E1A1A
- 160A0A
- 030101
Tones
- F2A4A2
- E5A09E
- D99D9B
- CC9997
- BF9593
- B3918F
- A68D8B
- 998888
- 8D8484
Color harmonies
Complementary +180°
- FFA8A6
Upstream Salmon
- 66D7DE
≈ Aquamarine Blue
Analogous -30° +30°
- FFA8A6
Upstream Salmon
- F7A7CB
≈ Rose Mallow
- F9B085
≈ Peach Velour
Triadic +120° +240°
- FFA8A6
Upstream Salmon
- 9ED495
≈ Young Greens
- A1C4FF
≈ Pastel Blue
Split-complementary +150° +210°
- FFA8A6
Upstream Salmon
- 77D9BA
≈ Peppy
- 78CFFA
≈ Bubbly Barracuda
Tetradic +90° +180° +270°
- FFA8A6
Upstream Salmon
- C5CA79
≈ Celery Green
- 66D7DE
≈ Aquamarine Blue
- C3B8FF
≈ Dried Lilac
Contrast & accessibility
Ag
FailOn white
WCAG 1.84:1 · APCA Lc 34
Ag
AAAOn black
WCAG 11.40:1 · APCA Lc 68
Best text color: #000000
WCAG 11.40:1 (AAA) · APCA Lc 68
Contrast pairs
Code snippets
CSS
:root {
--upstream-salmon: #ffa8a6;
--upstream-salmon-rgb: 255 168 166;
--upstream-salmon-oklch: oklch(0.816 0.103 21);
}
.element {
color: var(--upstream-salmon);
background-color: hsl(1 100% 83%);
border-color: oklch(0.816 0.103 21);
}Tailwind CSS v4
@theme {
--color-upstream-salmon: #ffa8a6;
--color-upstream-salmon-50: #ffeae7;
--color-upstream-salmon-100: #ffdbd8;
--color-upstream-salmon-200: #fec4c0;
--color-upstream-salmon-300: #e8a39f;
--color-upstream-salmon-400: #d58584;
--color-upstream-salmon-500: #c16868;
--color-upstream-salmon-600: #a35958;
--color-upstream-salmon-700: #834746;
--color-upstream-salmon-800: #613334;
--color-upstream-salmon-900: #442323;
--color-upstream-salmon-950: #2c1112;
}SCSS
$upstream-salmon: #ffa8a6;
$upstream-salmon-rgb: 255, 168, 166;
$upstream-salmon-light: mix(#fff, $upstream-salmon, 20%);
$upstream-salmon-dark: mix(#000, $upstream-salmon, 20%);
.element {
color: $upstream-salmon;
box-shadow: 0 0 0 2px rgba($upstream-salmon, 0.35);
}