Named color · #F9986F
Autumn Arrival
Autumn Arrival is #F9986F: rgb(249 152 111), hsl(18 92% 71%), oklch(0.771 0.129 43.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Autumn Arrival color name →
#F9986F
oklch(0.771 0.129 43.4)
Color conversions
- HEX
- #f9986f
- RGB
- rgb(249 152 111)
- HSL
- hsl(18 92% 71%)
- HWB
- hwb(18 44% 2%)
- OKLCH
- oklch(0.771 0.129 43.4)
- OKLab
- oklab(0.771 0.094 0.089)
- CIE Lab
- lab(72.59 34.48 37.67)
- LCH
- lch(72.59 51.06 47.5)
- CMYK
- cmyk(0% 39% 55% 2%)
Tints · Shades · Tones
Tints
- FBA37E
- FCAD8D
- FEB89B
- FFC2A9
- FFCCB8
- FFD7C6
- FFE1D4
- FFEBE2
- FFF5F1
Shades
- D98460
- B97051
- 9A5C42
- 7D4A34
- 613827
- 46271A
- 2C170E
- 150804
- 030101
Tones
- ED9672
- E19474
- D59276
- C99078
- BD8D7A
- B18B7B
- A5887D
- 99867E
- 8C837F
Color harmonies
Complementary +180°
- F9986F
Autumn Arrival
- 3AC6F1
≈ Shovel Knight
Analogous -30° +30°
- F9986F
Autumn Arrival
- FB909C
≈ Conch Shell
- E6A74C
≈ Zucchini Flower
Triadic +120° +240°
- F9986F
Autumn Arrival
- 58CE9D
≈ Vegetation
- AAAAFF
≈ Shy Moment
Split-complementary +150° +210°
- F9986F
Autumn Arrival
- 17CECC
≈ Blue Martina
- 7DB8FF
≈ Parakeet Blue
Tetradic +90° +180° +270°
- F9986F
Autumn Arrival
- 93C66E
≈ Pistachio
- 3AC6F1
≈ Shovel Knight
- D29BEF
≈ Dream Vapour
Contrast & accessibility
Ag
FailOn white
WCAG 2.15:1 · APCA Lc 42
Ag
AAAOn black
WCAG 9.74:1 · APCA Lc 60
Best text color: #000000
WCAG 9.74:1 (AAA) · APCA Lc 60
Contrast pairs
Code snippets
CSS
:root {
--autumn-arrival: #f9986f;
--autumn-arrival-rgb: 249 152 111;
--autumn-arrival-oklch: oklch(0.771 0.129 43.4);
}
.element {
color: var(--autumn-arrival);
background-color: hsl(18 92% 71%);
border-color: oklch(0.771 0.129 43.4);
}Tailwind CSS v4
@theme {
--color-autumn-arrival: #f9986f;
--color-autumn-arrival-50: #ffead7;
--color-autumn-arrival-100: #ffdbc5;
--color-autumn-arrival-200: #ffc3a6;
--color-autumn-arrival-300: #efa27f;
--color-autumn-arrival-400: #dd845d;
--color-autumn-arrival-500: #cb6537;
--color-autumn-arrival-600: #ab5630;
--color-autumn-arrival-700: #8a4526;
--color-autumn-arrival-800: #67311c;
--color-autumn-arrival-900: #482112;
--color-autumn-arrival-950: #2f1005;
}SCSS
$autumn-arrival: #f9986f;
$autumn-arrival-rgb: 249, 152, 111;
$autumn-arrival-light: mix(#fff, $autumn-arrival, 20%);
$autumn-arrival-dark: mix(#000, $autumn-arrival, 20%);
.element {
color: $autumn-arrival;
box-shadow: 0 0 0 2px rgba($autumn-arrival, 0.35);
}