Named color · #1D393C
Nordic
Nordic is #1D393C: rgb(29 57 60), hsl(186 35% 17%), oklch(0.324 0.034 204.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Nordic color name →
#1D393C
oklch(0.324 0.034 204.5)
Color conversions
- HEX
- #1d393c
- RGB
- rgb(29 57 60)
- HSL
- hsl(186 35% 17%)
- HWB
- hwb(186 11% 76%)
- OKLCH
- oklch(0.324 0.034 204.5)
- OKLab
- oklab(0.324 -0.031 -0.014)
- CIE Lab
- lab(21.87 -10.34 -5.38)
- LCH
- lch(21.87 11.65 207.5)
- CMYK
- cmyk(52% 5% 0% 76%)
Tints · Shades · Tones
Tints
- 314A4D
- 465C5F
- 5B6F71
- 718284
- 879698
- 9EAAAB
- B6BFC0
- CED4D4
- E6E9EA
Shades
- 183033
- 13282A
- 0E1F21
- 091719
- 051011
- 03090A
- 010404
- 000101
- 000000
Tones
- 274042
- 314749
- 3A4D50
- 445456
- 4E5C5D
- 586364
- 626A6B
- 6C7172
- 767979
Color harmonies
Complementary +180°
- 1D393C
Nordic
- 442D2B
≈ Old Burgundy
Analogous -30° +30°
- 1D393C
Nordic
- 203A33
≈ Palm Green
- 223743
≈ Petrol Slumber
Triadic +120° +240°
- 1D393C
Nordic
- 3D2E3E
≈ Disappearing Purple
- 3C331F
≈ Lebanon Cedar
Split-complementary +150° +210°
- 1D393C
Nordic
- 422D35
≈ Barossa
- 422F23
≈ Morocco Brown
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAAOn white
WCAG 12.33:1 · APCA Lc 98
Ag
FailOn black
WCAG 1.70:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 12.33:1 (AAA) · APCA Lc 98
Contrast pairs
Code snippets
CSS
:root {
--nordic: #1d393c;
--nordic-rgb: 29 57 60;
--nordic-oklch: oklch(0.324 0.034 204.5);
}
.element {
color: var(--nordic);
background-color: hsl(186 35% 17%);
border-color: oklch(0.324 0.034 204.5);
}Tailwind CSS v4
@theme {
--color-nordic: #1d393c;
--color-nordic-50: #ebf8fa;
--color-nordic-100: #dbebee;
--color-nordic-200: #c4d9db;
--color-nordic-300: #a4bdc0;
--color-nordic-400: #88a5a8;
--color-nordic-500: #6c8d91;
--color-nordic-600: #5b777a;
--color-nordic-700: #496062;
--color-nordic-800: #354648;
--color-nordic-900: #243032;
--color-nordic-950: #131d1e;
}SCSS
$nordic: #1d393c;
$nordic-rgb: 29, 57, 60;
$nordic-light: mix(#fff, $nordic, 20%);
$nordic-dark: mix(#000, $nordic, 20%);
.element {
color: $nordic;
box-shadow: 0 0 0 2px rgba($nordic, 0.35);
}