Named color · #FFBF99
Blushing Cinnamon
Blushing Cinnamon is #FFBF99: rgb(255 191 153), hsl(22 100% 80%), oklch(0.854 0.09 51.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Blushing Cinnamon color name →
#FFBF99
oklch(0.854 0.09 51.9)
Color conversions
- HEX
- #ffbf99
- RGB
- rgb(255 191 153)
- HSL
- hsl(22 100% 80%)
- HWB
- hwb(22 60% 0%)
- OKLCH
- oklch(0.854 0.09 51.9)
- OKLab
- oklab(0.854 0.055 0.07)
- CIE Lab
- lab(82.66 20.28 28.65)
- LCH
- lch(82.66 35.09 54.7)
- CMYK
- cmyk(0% 25% 40% 0%)
Tints · Shades · Tones
Tints
- FFC6A3
- FFCCAE
- FFD2B8
- FFD9C2
- FFDFCC
- FFE6D6
- FFECE1
- FFF2EB
- FFF9F5
Shades
- DEA684
- BE8D70
- 9E755D
- 805E4A
- 634838
- 483327
- 2E1F17
- 160D08
- 030201
Tones
- F2B997
- E5B295
- D8AC92
- CBA690
- BE9F8D
- B2998B
- A59388
- 998D86
- 8C8683
Color harmonies
Complementary +180°
- FFBF99
Blushing Cinnamon
- 93DAFF
≈ Shiva Blue
Analogous -30° +30°
- FFBF99
Blushing Cinnamon
- FFBBB8
≈ Hard Candy
- EDCA8B
≈ Ochre Revival
Triadic +120° +240°
- FFBF99
Blushing Cinnamon
- 90E3C8
≈ Clean Green
- CFC6FF
≈ Innocent Snowdrop
Split-complementary +150° +210°
- FFBF99
Blushing Cinnamon
- 83E1E8
≈ Paradisiacal Getaway
- B6D0FF
≈ Ice Cold Stare
Tetradic +90° +180° +270°
- FFBF99
Blushing Cinnamon
- AEDFA8
≈ Green Gooseberry
- 93DAFF
≈ Shiva Blue
- EBBCF2
≈ Lovecloud
Contrast & accessibility
Ag
FailOn white
WCAG 1.59:1 · APCA Lc 27
Ag
AAAOn black
WCAG 13.16:1 · APCA Lc 76
Best text color: #000000
WCAG 13.16:1 (AAA) · APCA Lc 76
Contrast pairs
Code snippets
CSS
:root {
--blushing-cinnamon: #ffbf99;
--blushing-cinnamon-rgb: 255 191 153;
--blushing-cinnamon-oklch: oklch(0.854 0.09 51.9);
}
.element {
color: var(--blushing-cinnamon);
background-color: hsl(22 100% 80%);
border-color: oklch(0.854 0.09 51.9);
}Tailwind CSS v4
@theme {
--color-blushing-cinnamon: #ffbf99;
--color-blushing-cinnamon-50: #ffefde;
--color-blushing-cinnamon-100: #ffe1cc;
--color-blushing-cinnamon-200: #f4cbb1;
--color-blushing-cinnamon-300: #ddac8c;
--color-blushing-cinnamon-400: #c98f6d;
--color-blushing-cinnamon-500: #b5744c;
--color-blushing-cinnamon-600: #996341;
--color-blushing-cinnamon-700: #7b4f34;
--color-blushing-cinnamon-800: #5b3925;
--color-blushing-cinnamon-900: #402719;
--color-blushing-cinnamon-950: #29150a;
}SCSS
$blushing-cinnamon: #ffbf99;
$blushing-cinnamon-rgb: 255, 191, 153;
$blushing-cinnamon-light: mix(#fff, $blushing-cinnamon, 20%);
$blushing-cinnamon-dark: mix(#000, $blushing-cinnamon, 20%);
.element {
color: $blushing-cinnamon;
box-shadow: 0 0 0 2px rgba($blushing-cinnamon, 0.35);
}