Benannte Farbe · #6699CC
Lothern Blue
Lothern Blue ist #6699CC: rgb(102 153 204), hsl(210 50% 60%), oklch(0.668 0.094 249.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Lothern Blue color name →
#6699CC
oklch(0.668 0.094 249.4)
Farbumrechnungen
- HEX
- #6699cc
- RGB
- rgb(102 153 204)
- HSL
- hsl(210 50% 60%)
- HWB
- hwb(210 40% 20%)
- OKLCH
- oklch(0.668 0.094 249.4)
- OKLab
- oklab(0.668 -0.033 -0.088)
- CIE Lab
- lab(61.18 -6.77 -32.01)
- LCH
- lch(61.18 32.72 258.1)
- CMYK
- cmyk(50% 25% 0% 20%)
Tints · Shades · Tones
Tints
- 75A3D1
- 84ADD7
- 94B7DC
- A3C2E1
- B2CCE6
- C1D6EC
- D0E0F1
- E0EAF5
- EFF5FA
Shades
- 5884B1
- 4A7097
- 3C5D7E
- 2F4A65
- 23384E
- 172737
- 0C1722
- 04080F
- 000102
Tones
- 6997C4
- 6C94BD
- 6F92B5
- 7290AE
- 758DA6
- 778B9F
- 7A8897
- 7C858F
- 7E8388
Farbharmonien
Komplementär +180°
- 6699CC
Lothern Blue
- BA8A52
≈ Canvas
Analog -30° +30°
- 6699CC
Lothern Blue
- 47A2BC
≈ Brig
- 888ECE
≈ Bailey Bells
Triadisch +120° +240°
- 6699CC
Lothern Blue
- C67C88
≈ Japanese Coral
- 82A061
≈ Verdant Serenade
Geteilt komplementär +150° +210°
- 6699CC
Lothern Blue
- C68069
≈ Earthworm
- A2964E
≈ Lentil Sprout
Tetradisch +90° +180° +270°
- 6699CC
Lothern Blue
- BB7EA7
≈ Romanov Mauve
- BA8A52
≈ Canvas
- 5DA680
≈ Laurel Wreath
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.00:1 · APCA Lc 57
Ag
AAAuf Schwarz
WCAG 6.99:1 · APCA Lc 45
Beste Textfarbe: #000000
WCAG 6.99:1 (AA) · APCA Lc 45
Contrast pairs
Code-Snippets
CSS
:root {
--lothern-blue: #6699cc;
--lothern-blue-rgb: 102 153 204;
--lothern-blue-oklch: oklch(0.668 0.094 249.4);
}
.element {
color: var(--lothern-blue);
background-color: hsl(210 50% 60%);
border-color: oklch(0.668 0.094 249.4);
}Tailwind CSS v4
@theme {
--color-lothern-blue: #6699cc;
--color-lothern-blue-50: #e2f8ff;
--color-lothern-blue-100: #d2ebff;
--color-lothern-blue-200: #b7d8fc;
--color-lothern-blue-300: #94bbe7;
--color-lothern-blue-400: #72a3d4;
--color-lothern-blue-500: #528ac2;
--color-lothern-blue-600: #4675a4;
--color-lothern-blue-700: #385e83;
--color-lothern-blue-800: #264561;
--color-lothern-blue-900: #193044;
--color-lothern-blue-950: #0a1c2c;
}SCSS
$lothern-blue: #6699cc;
$lothern-blue-rgb: 102, 153, 204;
$lothern-blue-light: mix(#fff, $lothern-blue, 20%);
$lothern-blue-dark: mix(#000, $lothern-blue, 20%);
.element {
color: $lothern-blue;
box-shadow: 0 0 0 2px rgba($lothern-blue, 0.35);
}