Named color · #8B5776
Queen’s Honour
Queen’s Honour is #8B5776: rgb(139 87 118), hsl(324 23% 44%), oklch(0.525 0.081 343.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Pink mean? → · Queen’s Honour color name →
#8B5776
oklch(0.525 0.081 343.7)
Color conversions
- HEX
- #8b5776
- RGB
- rgb(139 87 118)
- HSL
- hsl(324 23% 44%)
- HWB
- hwb(324 34% 45%)
- OKLCH
- oklch(0.525 0.081 343.7)
- OKLab
- oklab(0.525 0.077 -0.023)
- CIE Lab
- lab(43.76 25.6 -8.26)
- LCH
- lch(43.76 26.9 342.1)
- CMYK
- cmyk(0% 37% 15% 45%)
Tints · Shades · Tones
Tints
- 976783
- A27790
- AE879D
- BA97AB
- C5A8B8
- D1B9C6
- DCCAD4
- E8DCE2
- F3EDF1
Shades
- 784B66
- 663E56
- 543347
- 432738
- 321C29
- 23121C
- 14080F
- 070305
- 010001
Tones
- 8A5B77
- 8A6078
- 896479
- 88687A
- 876C7B
- 86707C
- 84747D
- 83787E
- 827C7F
Color harmonies
Complementary +180°
- 8B5776
Queen’s Honour
- 38795D
≈ Liquid Green Stuff
Analogous -30° +30°
- 8B5776
Queen’s Honour
- 7B5C8B
≈ Plum Power
- 93565C
≈ Mesa Red
Triadic +120° +240°
- 8B5776
Queen’s Honour
- 726C31
≈ Aged Mustard Green
- 2B748D
≈ Thousand Herb
Split-complementary +150° +210°
- 8B5776
Queen’s Honour
- 577443
≈ Houseplant
- 1F7978
≈ Atoll
Tetradic +90° +180° +270°
- 8B5776
Queen’s Honour
- 866331
≈ Dirt Brown
- 38795D
≈ Liquid Green Stuff
- 486D98
≈ Postwar Boom
Contrast & accessibility
Ag
AAOn white
WCAG 5.64:1 · APCA Lc 78
Ag
FailOn black
WCAG 3.72:1 · APCA Lc 24
Best text color: #FFFFFF
WCAG 5.64:1 (AA) · APCA Lc 78
Contrast pairs
Code snippets
CSS
:root {
--queen-s-honour: #8b5776;
--queen-s-honour-rgb: 139 87 118;
--queen-s-honour-oklch: oklch(0.525 0.081 343.7);
}
.element {
color: var(--queen-s-honour);
background-color: hsl(324 23% 44%);
border-color: oklch(0.525 0.081 343.7);
}Tailwind CSS v4
@theme {
--color-queen-s-honour: #8b5776;
--color-queen-s-honour-50: #ffecfa;
--color-queen-s-honour-100: #fddeee;
--color-queen-s-honour-200: #efc7dc;
--color-queen-s-honour-300: #d7a7c0;
--color-queen-s-honour-400: #c18caa;
--color-queen-s-honour-500: #ac7094;
--color-queen-s-honour-600: #915f7d;
--color-queen-s-honour-700: #754c64;
--color-queen-s-honour-800: #56374a;
--color-queen-s-honour-900: #3c2634;
--color-queen-s-honour-950: #25141f;
}SCSS
$queen-s-honour: #8b5776;
$queen-s-honour-rgb: 139, 87, 118;
$queen-s-honour-light: mix(#fff, $queen-s-honour, 20%);
$queen-s-honour-dark: mix(#000, $queen-s-honour, 20%);
.element {
color: $queen-s-honour;
box-shadow: 0 0 0 2px rgba($queen-s-honour, 0.35);
}