Benannte Farbe · #96AEC5
Nordland Light Blue
Nordland Light Blue ist #96AEC5: rgb(150 174 197), hsl(209 29% 68%), oklch(0.74 0.043 247.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Nordland Light Blue color name →
#96AEC5
oklch(0.74 0.043 247.3)
Farbumrechnungen
- HEX
- #96aec5
- RGB
- rgb(150 174 197)
- HSL
- hsl(209 29% 68%)
- HWB
- hwb(209 59% 23%)
- OKLCH
- oklch(0.74 0.043 247.3)
- OKLab
- oklab(0.74 -0.016 -0.039)
- CIE Lab
- lab(69.83 -4.72 -14.69)
- LCH
- lch(69.83 15.43 252.2)
- CMYK
- cmyk(24% 12% 0% 23%)
Tints · Shades · Tones
Tints
- A0B6CB
- AABED1
- B5C6D6
- BFCEDC
- CAD6E2
- D4DEE8
- DFE6EE
- E9EEF3
- F4F7F9
Shades
- 8297AB
- 6E8092
- 5B6A79
- 495561
- 37414B
- 262E35
- 161C21
- 080B0E
- 010102
Tones
- 94A9BE
- 92A5B7
- 90A0B0
- 8D9BA9
- 8B97A2
- 89929B
- 878E94
- 85898D
- 828587
Farbharmonien
Komplementär +180°
- 96AEC5
Nordland Light Blue
- BEA68F
≈ Fortress
Analog -30° +30°
- 96AEC5
Nordland Light Blue
- 8DB2BD
≈ Thistleblossom Soft Blue
- A4A9C6
≈ Wisteria Light Soft Blue
Triadisch +120° +240°
- 96AEC5
Nordland Light Blue
- C4A0A6
≈ Zephyr
- A3B094
≈ Family Tree
Geteilt komplementär +150° +210°
- 96AEC5
Nordland Light Blue
- C4A298
≈ Just Rosey
- B2AC8D
≈ Travertine Path
Tetradisch +90° +180° +270°
- 96AEC5
Nordland Light Blue
- BDA1B5
≈ Melting Moment
- BEA68F
≈ Fortress
- 95B3A0
≈ Burma Jade
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.29:1 · APCA Lc 45
Ag
AAAAuf Schwarz
WCAG 9.15:1 · APCA Lc 57
Beste Textfarbe: #000000
WCAG 9.15:1 (AAA) · APCA Lc 57
Contrast pairs
Code-Snippets
CSS
:root {
--nordland-light-blue: #96aec5;
--nordland-light-blue-rgb: 150 174 197;
--nordland-light-blue-oklch: oklch(0.74 0.043 247.3);
}
.element {
color: var(--nordland-light-blue);
background-color: hsl(209 29% 68%);
border-color: oklch(0.74 0.043 247.3);
}Tailwind CSS v4
@theme {
--color-nordland-light-blue: #96aec5;
--color-nordland-light-blue-50: #ecf6ff;
--color-nordland-light-blue-100: #dde9f6;
--color-nordland-light-blue-200: #c7d6e6;
--color-nordland-light-blue-300: #a7bacd;
--color-nordland-light-blue-400: #8ba1b7;
--color-nordland-light-blue-500: #7089a1;
--color-nordland-light-blue-600: #5f7488;
--color-nordland-light-blue-700: #4c5d6d;
--color-nordland-light-blue-800: #364450;
--color-nordland-light-blue-900: #252f38;
--color-nordland-light-blue-950: #141c23;
}SCSS
$nordland-light-blue: #96aec5;
$nordland-light-blue-rgb: 150, 174, 197;
$nordland-light-blue-light: mix(#fff, $nordland-light-blue, 20%);
$nordland-light-blue-dark: mix(#000, $nordland-light-blue, 20%);
.element {
color: $nordland-light-blue;
box-shadow: 0 0 0 2px rgba($nordland-light-blue, 0.35);
}