Named color · #843F5B
Ancient Royal Banner
Ancient Royal Banner is #843F5B: rgb(132 63 91), hsl(336 35% 38%), oklch(0.465 0.1 356.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Ancient Royal Banner color name →
#843F5B
oklch(0.465 0.1 356.1)
Color conversions
- HEX
- #843f5b
- RGB
- rgb(132 63 91)
- HSL
- hsl(336 35% 38%)
- HWB
- hwb(336 25% 48%)
- OKLCH
- oklch(0.465 0.1 356.1)
- OKLab
- oklab(0.465 0.1 -0.007)
- CIE Lab
- lab(36.61 32.66 -2.2)
- LCH
- lch(36.61 32.74 356.1)
- CMYK
- cmyk(0% 52% 31% 48%)
Tints · Shades · Tones
Tints
- 91516A
- 9E6479
- AB7689
- B78999
- C39CA9
- D0AFBA
- DCC3CB
- E7D7DC
- F3EBED
Shades
- 72354E
- 602C41
- 4F2335
- 3F1B29
- 2F121E
- 200A13
- 120409
- 060103
- 010000
Tones
- 85465F
- 854D62
- 855466
- 855A6A
- 85616D
- 846771
- 846D75
- 837478
- 817A7C
Color harmonies
Complementary +180°
- 843F5B
Ancient Royal Banner
- 006958
≈ Fresh Ivy Green
Analogous -30° +30°
- 843F5B
Ancient Royal Banner
- 764477
≈ Purple Passion
- 89403B
≈ Aged Brandy
Triadic +120° +240°
- 843F5B
Ancient Royal Banner
- 57600E
≈ Kirchner Green
- 006189
≈ Ink Blotch
Split-complementary +150° +210°
- 843F5B
Ancient Royal Banner
- 2F6835
≈ Vegas Green
- 00666F
≈ Wakame Green
Tetradic +90° +180° +270°
- 843F5B
Ancient Royal Banner
- 715500
≈ Pickled Grape Leaves
- 006958
≈ Fresh Ivy Green
- 3F5691
≈ Demon Blue
Contrast & accessibility
Ag
AAAOn white
WCAG 7.38:1 · APCA Lc 85
Ag
FailOn black
WCAG 2.84:1 · APCA Lc 17
Best text color: #FFFFFF
WCAG 7.38:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--ancient-royal-banner: #843f5b;
--ancient-royal-banner-rgb: 132 63 91;
--ancient-royal-banner-oklch: oklch(0.465 0.1 356.1);
}
.element {
color: var(--ancient-royal-banner);
background-color: hsl(336 35% 38%);
border-color: oklch(0.465 0.1 356.1);
}Tailwind CSS v4
@theme {
--color-ancient-royal-banner: #843f5b;
--color-ancient-royal-banner-50: #ffeaf5;
--color-ancient-royal-banner-100: #ffdbe8;
--color-ancient-royal-banner-200: #f9c3d4;
--color-ancient-royal-banner-300: #e2a2b7;
--color-ancient-royal-banner-400: #ce85a0;
--color-ancient-royal-banner-500: #ba6988;
--color-ancient-royal-banner-600: #9d5973;
--color-ancient-royal-banner-700: #7e475c;
--color-ancient-royal-banner-800: #5d3345;
--color-ancient-royal-banner-900: #41232f;
--color-ancient-royal-banner-950: #2a121c;
}SCSS
$ancient-royal-banner: #843f5b;
$ancient-royal-banner-rgb: 132, 63, 91;
$ancient-royal-banner-light: mix(#fff, $ancient-royal-banner, 20%);
$ancient-royal-banner-dark: mix(#000, $ancient-royal-banner, 20%);
.element {
color: $ancient-royal-banner;
box-shadow: 0 0 0 2px rgba($ancient-royal-banner, 0.35);
}