Nearest named color · #003F99
#003F99
Nearest named color: Cascade Twilight
#003F99 (rgb(0 63 153), hsl(215 100% 30%), oklch(0.395 0.158 259.6)) is closest to the named color Cascade Twilight. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#003F99
oklch(0.395 0.158 259.6)
Color conversions
- HEX
- #003f99
- RGB
- rgb(0 63 153)
- HSL
- hsl(215 100% 30%)
- HWB
- hwb(215 0% 40%)
- OKLCH
- oklch(0.395 0.158 259.6)
- OKLab
- oklab(0.395 -0.028 -0.156)
- CIE Lab
- lab(28.1 13.11 -55.05)
- LCH
- lch(28.1 56.59 283.4)
- CMYK
- cmyk(100% 59% 0% 40%)
Tints · Shades · Tones
Tints
- 2053A4
- 3966B0
- 5179BA
- 698CC5
- 819FCF
- 99B2D9
- B2C5E3
- CBD8ED
- E5EBF6
Shades
- 003584
- 002C70
- 00235D
- 001B4A
- 001238
- 000A27
- 000417
- 000108
- 000001
Tones
- 144797
- 234F96
- 305694
- 3C5D92
- 476390
- 53698D
- 5E6F8A
- 697587
- 757B84
Color harmonies
Complementary +180°
- 003F99
Cascade Twilight
- 5D4000
≈ Hippogriff Brown
Analogous -30° +30°
- 003F99
Cascade Twilight
- 004E68
≈ Work Blue
- 492D93
≈ Galactic Purple
Triadic +120° +240°
- 003F99
Cascade Twilight
- 870120
≈ Red Mulled Wine
- 175500
≈ Donegal Green
Split-complementary +150° +210°
- 003F99
Cascade Twilight
- 713100
≈ Bay Brown
- 4A4A00
≈ No Emissions Green
Tetradic +90° +180° +270°
- 003F99
Cascade Twilight
- 7E0953
≈ French Plum
- 5D4000
≈ Hippogriff Brown
- 005440
≈ Sacramento State Green
Contrast & accessibility
Ag
AAAOn white
WCAG 9.67:1 · APCA Lc 92
Ag
FailOn black
WCAG 2.17:1 · APCA Lc 11
Best text color: #FFFFFF
WCAG 9.67:1 (AAA) · APCA Lc 92
Contrast pairs
Code snippets
CSS
:root {
--cascade-twilight: #003f99;
--cascade-twilight-rgb: 0 63 153;
--cascade-twilight-oklch: oklch(0.395 0.158 259.6);
}
.element {
color: var(--cascade-twilight);
background-color: hsl(215 100% 30%);
border-color: oklch(0.395 0.158 259.6);
}Tailwind CSS v4
@theme {
--color-cascade-twilight: #003f99;
--color-cascade-twilight-50: #dcf6ff;
--color-cascade-twilight-100: #cbe9ff;
--color-cascade-twilight-200: #afd5ff;
--color-cascade-twilight-300: #8ab7ff;
--color-cascade-twilight-400: #649dfb;
--color-cascade-twilight-500: #4182ed;
--color-cascade-twilight-600: #386fc8;
--color-cascade-twilight-700: #2c59a1;
--color-cascade-twilight-800: #1b4178;
--color-cascade-twilight-900: #112d55;
--color-cascade-twilight-950: #041a39;
}SCSS
$cascade-twilight: #003f99;
$cascade-twilight-rgb: 0, 63, 153;
$cascade-twilight-light: mix(#fff, $cascade-twilight, 20%);
$cascade-twilight-dark: mix(#000, $cascade-twilight, 20%);
.element {
color: $cascade-twilight;
box-shadow: 0 0 0 2px rgba($cascade-twilight, 0.35);
}