Benannte Farbe · #525E68
Wizard Grey
Wizard Grey ist #525E68: rgb(82 94 104), hsl(207 12% 36%), oklch(0.475 0.022 243.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Wizard Grey color name →
#525E68
oklch(0.475 0.022 243.3)
Farbumrechnungen
- HEX
- #525e68
- RGB
- rgb(82 94 104)
- HSL
- hsl(207 12% 36%)
- HWB
- hwb(207 32% 59%)
- OKLCH
- oklch(0.475 0.022 243.3)
- OKLab
- oklab(0.475 -0.01 -0.02)
- CIE Lab
- lab(39.14 -2.99 -7.38)
- LCH
- lch(39.14 7.96 247.9)
- CMYK
- cmyk(21% 10% 0% 59%)
Tints · Shades · Tones
Tints
- 626D76
- 727C84
- 828B93
- 939BA2
- A4ABB1
- B6BBC0
- C8CCCF
- DADDDF
- ECEEEF
Shades
- 465159
- 3B444B
- 2F373E
- 252B30
- 1A1F24
- 111418
- 080A0C
- 020304
- 000000
Tones
- 56616A
- 5B656D
- 60686F
- 646B72
- 696F74
- 6D7276
- 727679
- 77797B
- 7B7D7E
Farbharmonien
Komplementär +180°
- 525E68
Wizard Grey
- 665A50
≈ Underground
Analog -30° +30°
- 525E68
Wizard Grey
- 4F6064
≈ Limousine Grey Blue
- 585C69
≈ Evening East
Triadisch +120° +240°
- 525E68
Wizard Grey
- 68575B
≈ Sparrow
- 5A5F51
≈ Soft Olive
Geteilt komplementär +150° +210°
- 525E68
Wizard Grey
- 685854
≈ Nocturnal Flight
- 605C4E
≈ Hayden Valley
Tetradisch +90° +180° +270°
- 525E68
Wizard Grey
- 645862
≈ Preservation Plum
- 665A50
≈ Underground
- 536057
≈ Siberian Green
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.64:1 · APCA Lc 83
Ag
FailAuf Schwarz
WCAG 3.15:1 · APCA Lc 19
Beste Textfarbe: #FFFFFF
WCAG 6.64:1 (AA) · APCA Lc 83
Contrast pairs
Code-Snippets
CSS
:root {
--wizard-grey: #525e68;
--wizard-grey-rgb: 82 94 104;
--wizard-grey-oklch: oklch(0.475 0.022 243.3);
}
.element {
color: var(--wizard-grey);
background-color: hsl(207 12% 36%);
border-color: oklch(0.475 0.022 243.3);
}Tailwind CSS v4
@theme {
--color-wizard-grey: #525e68;
--color-wizard-grey-50: #f0f6fb;
--color-wizard-grey-100: #e2e9ef;
--color-wizard-grey-200: #cdd5dd;
--color-wizard-grey-300: #aeb9c2;
--color-wizard-grey-400: #94a0ab;
--color-wizard-grey-500: #7a8894;
--color-wizard-grey-600: #67737d;
--color-wizard-grey-700: #535c64;
--color-wizard-grey-800: #3c4349;
--color-wizard-grey-900: #292f33;
--color-wizard-grey-950: #171b1f;
}SCSS
$wizard-grey: #525e68;
$wizard-grey-rgb: 82, 94, 104;
$wizard-grey-light: mix(#fff, $wizard-grey, 20%);
$wizard-grey-dark: mix(#000, $wizard-grey, 20%);
.element {
color: $wizard-grey;
box-shadow: 0 0 0 2px rgba($wizard-grey, 0.35);
}