Nächste benannte Farbe · #18347B
#18347B
Nächste benannte Farbe: Twilight Express
#18347B (rgb(24 52 123), hsl(223 67% 29%), oklch(0.351 0.126 264.5)) liegt am nächsten an der benannten Farbe Twilight Express. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#18347B
oklch(0.351 0.126 264.5)
Farbumrechnungen
- HEX
- #18347b
- RGB
- rgb(24 52 123)
- HSL
- hsl(223 67% 29%)
- HWB
- hwb(223 9% 52%)
- OKLCH
- oklch(0.351 0.126 264.5)
- OKLab
- oklab(0.351 -0.012 -0.125)
- CIE Lab
- lab(23.22 11.68 -44.38)
- LCH
- lch(23.22 45.89 284.7)
- CMYK
- cmyk(80% 58% 0% 52%)
Tints · Shades · Tones
Tints
- 2C4889
- 415C96
- 566FA4
- 6D83B1
- 8497BE
- 9BABCC
- B3C0D9
- CCD4E5
- E5EAF2
Shades
- 132C6A
- 0F245A
- 0A1C4A
- 07153A
- 040E2C
- 02071E
- 010310
- 000105
- 000001
Tones
- 223D7C
- 2C457E
- 364D7F
- 40547F
- 4A5C80
- 556381
- 606A81
- 6A7281
- 757981
Farbharmonien
Komplementär +180°
- 18347B
Twilight Express
- 4C3700
≈ Eyelash Camel
Analog -30° +30°
- 18347B
Twilight Express
- 00405B
≈ Maniac Mansion
- 412774
≈ Clear Purple
Triadisch +120° +240°
- 18347B
Twilight Express
- 6E1116
≈ Festive Bordeaux
- 00490B
≈ Borg Queen
Geteilt komplementär +150° +210°
- 18347B
Twilight Express
- 5C2B00
≈ Count Chocula
- 3A3F00
≈ Dark Olive
Tetradisch +90° +180° +270°
- 18347B
Twilight Express
- 68123F
≈ Her Fierceness
- 4C3700
≈ Eyelash Camel
- 004638
≈ UP Forest Green
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 11.56:1 · APCA Lc 96
Ag
FailAuf Schwarz
WCAG 1.81:1 · APCA Lc 0
Beste Textfarbe: #FFFFFF
WCAG 11.56:1 (AAA) · APCA Lc 96
Contrast pairs
Code-Snippets
CSS
:root {
--twilight-express: #18347b;
--twilight-express-rgb: 24 52 123;
--twilight-express-oklch: oklch(0.351 0.126 264.5);
}
.element {
color: var(--twilight-express);
background-color: hsl(223 67% 29%);
border-color: oklch(0.351 0.126 264.5);
}Tailwind CSS v4
@theme {
--color-twilight-express: #18347b;
--color-twilight-express-50: #e5f5ff;
--color-twilight-express-100: #d5e8ff;
--color-twilight-express-200: #bcd4ff;
--color-twilight-express-300: #9ab6f9;
--color-twilight-express-400: #799de9;
--color-twilight-express-500: #5c83d9;
--color-twilight-express-600: #4e6fb7;
--color-twilight-express-700: #3e5993;
--color-twilight-express-800: #2a416e;
--color-twilight-express-900: #1c2d4d;
--color-twilight-express-950: #0d1a33;
}SCSS
$twilight-express: #18347b;
$twilight-express-rgb: 24, 52, 123;
$twilight-express-light: mix(#fff, $twilight-express, 20%);
$twilight-express-dark: mix(#000, $twilight-express, 20%);
.element {
color: $twilight-express;
box-shadow: 0 0 0 2px rgba($twilight-express, 0.35);
}