Benannte Farbe · #6A808F
Blue Prince
Blue Prince ist #6A808F: rgb(106 128 143), hsl(204 15% 49%), oklch(0.588 0.034 238). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Blue Prince color name →
#6A808F
oklch(0.588 0.034 238)
Farbumrechnungen
- HEX
- #6a808f
- RGB
- rgb(106 128 143)
- HSL
- hsl(204 15% 49%)
- HWB
- hwb(204 42% 44%)
- OKLCH
- oklch(0.588 0.034 238)
- OKLab
- oklab(0.588 -0.018 -0.029)
- CIE Lab
- lab(52.23 -5.56 -10.92)
- LCH
- lch(52.23 12.25 243)
- CMYK
- cmyk(26% 10% 0% 44%)
Tints · Shades · Tones
Tints
- 788C9A
- 8698A5
- 95A5B0
- A3B1BB
- B2BEC6
- C1CAD1
- D0D7DC
- E0E4E8
- EFF2F3
Shades
- 5B6E7C
- 4D5D69
- 3F4D57
- 313D45
- 242E34
- 181F24
- 0D1215
- 040607
- 000101
Tones
- 6C808E
- 6F808C
- 71808B
- 738089
- 758088
- 778086
- 7A8085
- 7C8083
- 7E8082
Farbharmonien
Komplementär +180°
- 6A808F
Blue Prince
- 8D7869
≈ Caffeine
Analog -30° +30°
- 6A808F
Blue Prince
- 658387
≈ Arctic
- 747C92
≈ Soulful Blue
Triadisch +120° +240°
- 6A808F
Blue Prince
- 8F747C
≈ Plum Legacy
- 7A8069
≈ Oil Green
Geteilt komplementär +150° +210°
- 6A808F
Blue Prince
- 907571
≈ Bitter Briar
- 857C66
≈ Deserted Island
Tetradisch +90° +180° +270°
- 6A808F
Blue Prince
- 887687
≈ Faded Orchid
- 8D7869
≈ Caffeine
- 6F8371
≈ Hibiscus Leaf
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 4.11:1 · APCA Lc 68
Ag
AAAuf Schwarz
WCAG 5.09:1 · APCA Lc 33
Beste Textfarbe: #000000
WCAG 5.09:1 (AA) · APCA Lc 33
Contrast pairs
Code-Snippets
CSS
:root {
--blue-prince: #6a808f;
--blue-prince-rgb: 106 128 143;
--blue-prince-oklch: oklch(0.588 0.034 238);
}
.element {
color: var(--blue-prince);
background-color: hsl(204 15% 49%);
border-color: oklch(0.588 0.034 238);
}Tailwind CSS v4
@theme {
--color-blue-prince: #6a808f;
--color-blue-prince-50: #edf7fe;
--color-blue-prince-100: #deeaf2;
--color-blue-prince-200: #c8d7e2;
--color-blue-prince-300: #a8bac8;
--color-blue-prince-400: #8ca2b1;
--color-blue-prince-500: #718a9b;
--color-blue-prince-600: #607583;
--color-blue-prince-700: #4d5d69;
--color-blue-prince-800: #37444d;
--color-blue-prince-900: #262f35;
--color-blue-prince-950: #141c21;
}SCSS
$blue-prince: #6a808f;
$blue-prince-rgb: 106, 128, 143;
$blue-prince-light: mix(#fff, $blue-prince, 20%);
$blue-prince-dark: mix(#000, $blue-prince, 20%);
.element {
color: $blue-prince;
box-shadow: 0 0 0 2px rgba($blue-prince, 0.35);
}