Nearest named color · #3F304B
#3F304B
Nearest named color: Sanctum of Shadows
#3F304B (rgb(63 48 75), hsl(273 22% 24%), oklch(0.338 0.05 309.3)) is closest to the named color Sanctum of Shadows. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#3F304B
oklch(0.338 0.05 309.3)
Color conversions
- HEX
- #3f304b
- RGB
- rgb(63 48 75)
- HSL
- hsl(273 22% 24%)
- HWB
- hwb(273 19% 71%)
- OKLCH
- oklch(0.338 0.05 309.3)
- OKLab
- oklab(0.338 0.032 -0.039)
- CIE Lab
- lab(22.48 11.6 -14.15)
- LCH
- lch(22.48 18.3 309.3)
- CMYK
- cmyk(16% 36% 0% 71%)
Tints · Shades · Tones
Tints
- 50425B
- 62556C
- 74687D
- 867C8F
- 9991A1
- ADA6B3
- C1BCC6
- D5D2D8
- EAE8EC
Shades
- 352840
- 2C2135
- 231A2B
- 1B1321
- 120C17
- 0A060E
- 040306
- 010102
- 000000
Tones
- 453850
- 4B3F56
- 52475B
- 584F60
- 5F5765
- 655F6B
- 6C6770
- 726F75
- 79787B
Color harmonies
Complementary +180°
- 3F304B
Sanctum of Shadows
- 2F3C20
≈ Turtle Skin
Analogous -30° +30°
- 3F304B
Sanctum of Shadows
- 323451
≈ Tiě Hēi Metal
- 492D40
≈ Barossa
Triadic +120° +240°
- 3F304B
Sanctum of Shadows
- 483219
≈ Bavarian Sweet Mustard
- 10403D
≈ Botanical Night
Split-complementary +150° +210°
- 3F304B
Sanctum of Shadows
- 3E3817
≈ Camouflage
- 1E3F2E
≈ Mizukaze Green
Tetradic +90° +180° +270°
- 3F304B
Sanctum of Shadows
- 4E2E24
≈ Acajou
- 2F3C20
≈ Turtle Skin
- 133D49
≈ Sunken Harbour
Contrast & accessibility
Ag
AAAOn white
WCAG 12.09:1 · APCA Lc 98
Ag
FailOn black
WCAG 1.73:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 12.09:1 (AAA) · APCA Lc 98
Contrast pairs
Code snippets
CSS
:root {
--sanctum-of-shadows: #3f304b;
--sanctum-of-shadows-rgb: 63 48 75;
--sanctum-of-shadows-oklch: oklch(0.338 0.05 309.3);
}
.element {
color: var(--sanctum-of-shadows);
background-color: hsl(273 22% 24%);
border-color: oklch(0.338 0.05 309.3);
}Tailwind CSS v4
@theme {
--color-sanctum-of-shadows: #3f304b;
--color-sanctum-of-shadows-50: #faf1ff;
--color-sanctum-of-shadows-100: #ede3f5;
--color-sanctum-of-shadows-200: #dbcfe4;
--color-sanctum-of-shadows-300: #c0b1cb;
--color-sanctum-of-shadows-400: #a797b5;
--color-sanctum-of-shadows-500: #907da0;
--color-sanctum-of-shadows-600: #7a6a87;
--color-sanctum-of-shadows-700: #61556c;
--color-sanctum-of-shadows-800: #473e50;
--color-sanctum-of-shadows-900: #312b38;
--color-sanctum-of-shadows-950: #1d1822;
}SCSS
$sanctum-of-shadows: #3f304b;
$sanctum-of-shadows-rgb: 63, 48, 75;
$sanctum-of-shadows-light: mix(#fff, $sanctum-of-shadows, 20%);
$sanctum-of-shadows-dark: mix(#000, $sanctum-of-shadows, 20%);
.element {
color: $sanctum-of-shadows;
box-shadow: 0 0 0 2px rgba($sanctum-of-shadows, 0.35);
}