Nächste benannte Farbe · #646A8C
#646A8C
Nächste benannte Farbe: Dark Prince
#646A8C (rgb(100 106 140), hsl(231 17% 47%), oklch(0.532 0.054 276.6)) liegt am nächsten an der benannten Farbe Dark Prince. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#646A8C
oklch(0.532 0.054 276.6)
Farbumrechnungen
- HEX
- #646a8c
- RGB
- rgb(100 106 140)
- HSL
- hsl(231 17% 47%)
- HWB
- hwb(231 39% 45%)
- OKLCH
- oklch(0.532 0.054 276.6)
- OKLab
- oklab(0.532 0.006 -0.054)
- CIE Lab
- lab(45.3 3.84 -19.64)
- LCH
- lch(45.3 20.01 281.1)
- CMYK
- cmyk(29% 24% 0% 45%)
Tints · Shades · Tones
Tints
- 727897
- 8186A2
- 9094AE
- 9FA3B9
- AEB2C5
- BEC1D0
- CED0DC
- DEE0E7
- EEEFF3
Shades
- 565B79
- 484D67
- 3B3F55
- 2E3143
- 222433
- 161823
- 0B0D14
- 030407
- 000001
Tones
- 676C8B
- 696F8A
- 6C7189
- 6F7388
- 727586
- 757785
- 777A84
- 7A7C83
- 7D7E81
Farbharmonien
Komplementär +180°
- 646A8C
Dark Prince
- 756D48
≈ Trim
Analog -30° +30°
- 646A8C
Dark Prince
- 53708A
≈ Captains Blue
- 746585
≈ Posy Purple
Triadisch +120° +240°
- 646A8C
Dark Prince
- 896257
≈ Clove
- 527660
≈ Painted Turtle
Geteilt komplementär +150° +210°
- 646A8C
Dark Prince
- 82674B
≈ Anthill
- 647350
≈ Greenfield
Tetradisch +90° +180° +270°
- 646A8C
Dark Prince
- 886067
≈ Rabbit Paws
- 756D48
≈ Trim
- 467771
≈ Tandayapa Cloud Forest
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 5.27:1 · APCA Lc 76
Ag
FailAuf Schwarz
WCAG 3.98:1 · APCA Lc 26
Beste Textfarbe: #FFFFFF
WCAG 5.27:1 (AA) · APCA Lc 76
Contrast pairs
Code-Snippets
CSS
:root {
--dark-prince: #646a8c;
--dark-prince-rgb: 100 106 140;
--dark-prince-oklch: oklch(0.532 0.054 276.6);
}
.element {
color: var(--dark-prince);
background-color: hsl(231 17% 47%);
border-color: oklch(0.532 0.054 276.6);
}Tailwind CSS v4
@theme {
--color-dark-prince: #646a8c;
--color-dark-prince-50: #f1f4ff;
--color-dark-prince-100: #e3e7fa;
--color-dark-prince-200: #cfd2ec;
--color-dark-prince-300: #b1b5d3;
--color-dark-prince-400: #969cbf;
--color-dark-prince-500: #7c83aa;
--color-dark-prince-600: #696f90;
--color-dark-prince-700: #545973;
--color-dark-prince-800: #3d4155;
--color-dark-prince-900: #2a2d3c;
--color-dark-prince-950: #171a25;
}SCSS
$dark-prince: #646a8c;
$dark-prince-rgb: 100, 106, 140;
$dark-prince-light: mix(#fff, $dark-prince, 20%);
$dark-prince-dark: mix(#000, $dark-prince, 20%);
.element {
color: $dark-prince;
box-shadow: 0 0 0 2px rgba($dark-prince, 0.35);
}