Benannte Farbe · #7C89AB
Purple Impression
Purple Impression ist #7C89AB: rgb(124 137 171), hsl(223 22% 58%), oklch(0.632 0.054 268.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Purple Impression color name →
#7C89AB
oklch(0.632 0.054 268.5)
Farbumrechnungen
- HEX
- #7c89ab
- RGB
- rgb(124 137 171)
- HSL
- hsl(223 22% 58%)
- HWB
- hwb(223 49% 33%)
- OKLCH
- oklch(0.632 0.054 268.5)
- OKLab
- oklab(0.632 -0.001 -0.054)
- CIE Lab
- lab(56.96 1.1 -19.73)
- LCH
- lch(56.96 19.76 273.2)
- CMYK
- cmyk(27% 20% 0% 33%)
Tints · Shades · Tones
Tints
- 8894B3
- 95A0BC
- A1ABC4
- AEB7CC
- BBC3D5
- C9CEDD
- D6DAE6
- E4E7EE
- F1F3F7
Shades
- 6B7694
- 5A647E
- 4A5368
- 3B4254
- 2C3140
- 1E222D
- 11141B
- 05070B
- 010101
Tones
- 7C88A7
- 7D87A2
- 7D869E
- 7E869A
- 7E8596
- 7E8491
- 7F838D
- 7F8289
- 808184
Farbharmonien
Komplementär +180°
- 7C89AB
Purple Impression
- 978864
≈ Treasure Chamber
Analog -30° +30°
- 7C89AB
Purple Impression
- 6C8FA7
≈ French Court
- 8E83A6
≈ Fabulous Grape
Triadisch +120° +240°
- 7C89AB
Purple Impression
- A87E77
≈ Fresh Cedar
- 749378
≈ Watercress
Geteilt komplementär +150° +210°
- 7C89AB
Purple Impression
- A3826A
≈ Iced Mocha
- 868F6A
≈ Green Coconut
Tetradisch +90° +180° +270°
- 7C89AB
Purple Impression
- A67D89
≈ Silken Raspberry
- 978864
≈ Treasure Chamber
- 66958A
≈ Nephrite
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.48:1 · APCA Lc 62
Ag
AAAuf Schwarz
WCAG 6.02:1 · APCA Lc 39
Beste Textfarbe: #000000
WCAG 6.02:1 (AA) · APCA Lc 39
Contrast pairs
Code-Snippets
CSS
:root {
--purple-impression: #7c89ab;
--purple-impression-rgb: 124 137 171;
--purple-impression-oklch: oklch(0.632 0.054 268.5);
}
.element {
color: var(--purple-impression);
background-color: hsl(223 22% 58%);
border-color: oklch(0.632 0.054 268.5);
}Tailwind CSS v4
@theme {
--color-purple-impression: #7c89ab;
--color-purple-impression-50: #eff5ff;
--color-purple-impression-100: #e1e7fa;
--color-purple-impression-200: #cbd4ec;
--color-purple-impression-300: #adb7d4;
--color-purple-impression-400: #919ebf;
--color-purple-impression-500: #7785aa;
--color-purple-impression-600: #657190;
--color-purple-impression-700: #515a73;
--color-purple-impression-800: #3a4255;
--color-purple-impression-900: #282e3c;
--color-purple-impression-950: #161a25;
}SCSS
$purple-impression: #7c89ab;
$purple-impression-rgb: 124, 137, 171;
$purple-impression-light: mix(#fff, $purple-impression, 20%);
$purple-impression-dark: mix(#000, $purple-impression, 20%);
.element {
color: $purple-impression;
box-shadow: 0 0 0 2px rgba($purple-impression, 0.35);
}