Named color · #BB7700
Cassandra’s Curse
Cassandra’s Curse is #BB7700: rgb(187 119 0), hsl(38 100% 37%), oklch(0.626 0.136 70.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Cassandra’s Curse color name →
#BB7700
oklch(0.626 0.136 70.2)
Color conversions
- HEX
- #bb7700
- RGB
- rgb(187 119 0)
- HSL
- hsl(38 100% 37%)
- HWB
- hwb(38 0% 27%)
- OKLCH
- oklch(0.626 0.136 70.2)
- OKLab
- oklab(0.626 0.046 0.128)
- CIE Lab
- lab(56.37 22.19 62.57)
- LCH
- lch(56.37 66.38 70.5)
- CMYK
- cmyk(0% 36% 100% 27%)
Tints · Shades · Tones
Tints
- C28532
- CA924E
- D1A066
- D8AD7C
- DFBB92
- E5C8A8
- ECD6BE
- F2E4D3
- F9F1E9
Shades
- A26700
- 8A5700
- 734700
- 5C3800
- 462A00
- 321C00
- 1F1000
- 0D0500
- 020100
Tones
- B57923
- B07A34
- AA7B41
- A47C4D
- 9F7D57
- 997E60
- 937F68
- 8D7F71
- 868078
Color harmonies
Complementary +180°
- BB7700
Cassandra’s Curse
- 3F8CD6
≈ Magical Merlin
Analogous -30° +30°
- BB7700
Cassandra’s Curse
- CB6844
≈ Terracotta
- 9B8900
≈ Medusa Green
Triadic +120° +240°
- BB7700
Cassandra’s Curse
- 009C97
≈ Caribbean Turquoise
- A16FC5
≈ Rich Lavender
Split-complementary +150° +210°
- BB7700
Cassandra’s Curse
- 0097B8
≈ Bondi Blue
- 797DD8
≈ Tanzine
Tetradic +90° +180° +270°
- BB7700
Cassandra’s Curse
- 19A06B
≈ Biel-Tan Green
- 3F8CD6
≈ Magical Merlin
- BD64A1
≈ Young Purple
Contrast & accessibility
Ag
FailOn white
WCAG 3.65:1 · APCA Lc 64
Ag
AAOn black
WCAG 5.75:1 · APCA Lc 38
Best text color: #000000
WCAG 5.75:1 (AA) · APCA Lc 38
Contrast pairs
Code snippets
CSS
:root {
--cassandra-s-curse: #bb7700;
--cassandra-s-curse-rgb: 187 119 0;
--cassandra-s-curse-oklch: oklch(0.626 0.136 70.2);
}
.element {
color: var(--cassandra-s-curse);
background-color: hsl(38 100% 37%);
border-color: oklch(0.626 0.136 70.2);
}Tailwind CSS v4
@theme {
--color-cassandra-s-curse: #bb7700;
--color-cassandra-s-curse-50: #fff0cb;
--color-cassandra-s-curse-100: #ffe1b7;
--color-cassandra-s-curse-200: #f9cb94;
--color-cassandra-s-curse-300: #e2ac66;
--color-cassandra-s-curse-400: #d18f37;
--color-cassandra-s-curse-500: #be7300;
--color-cassandra-s-curse-600: #a06100;
--color-cassandra-s-curse-700: #804e00;
--color-cassandra-s-curse-800: #603800;
--color-cassandra-s-curse-900: #442600;
--color-cassandra-s-curse-950: #2b1400;
}SCSS
$cassandra-s-curse: #bb7700;
$cassandra-s-curse-rgb: 187, 119, 0;
$cassandra-s-curse-light: mix(#fff, $cassandra-s-curse, 20%);
$cassandra-s-curse-dark: mix(#000, $cassandra-s-curse, 20%);
.element {
color: $cassandra-s-curse;
box-shadow: 0 0 0 2px rgba($cassandra-s-curse, 0.35);
}