Benannte Farbe · #5772B0
Prefect
Prefect ist #5772B0: rgb(87 114 176), hsl(222 36% 52%), oklch(0.559 0.102 265.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Prefect color name →
#5772B0
oklch(0.559 0.102 265.4)
Farbumrechnungen
- HEX
- #5772b0
- RGB
- rgb(87 114 176)
- HSL
- hsl(222 36% 52%)
- HWB
- hwb(222 34% 31%)
- OKLCH
- oklch(0.559 0.102 265.4)
- OKLab
- oklab(0.559 -0.008 -0.102)
- CIE Lab
- lab(48.03 3.55 -36.62)
- LCH
- lch(48.03 36.79 275.5)
- CMYK
- cmyk(51% 35% 0% 31%)
Tints · Shades · Tones
Tints
- 6680B8
- 768DC1
- 869BC9
- 97A9D1
- A8B7D9
- B9C5E1
- CAD4E8
- DBE2F0
- EDF0F8
Shades
- 4B6299
- 3E5382
- 33446C
- 273656
- 1C2842
- 121B2E
- 080E1C
- 03040B
- 000101
Tones
- 5B74AC
- 5F75A7
- 6377A2
- 67799E
- 6C7A99
- 707B94
- 747D8F
- 787E8A
- 7C7F85
Farbharmonien
Komplementär +180°
- 5772B0
Prefect
- 8F6F1F
≈ Corn Harvest
Analog -30° +30°
- 5772B0
Prefect
- 297DA7
≈ Prominent Blue
- 7967A9
≈ Clear Mauve
Triadisch +120° +240°
- 5772B0
Prefect
- A85B55
≈ Cheek Red
- 4A844E
≈ Kilkenny
Geteilt komplementär +150° +210°
- 5772B0
Prefect
- A16334
≈ Wet Adobe
- 727B2D
≈ Ripe Green
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 4.73:1 · APCA Lc 73
Ag
FailAuf Schwarz
WCAG 4.43:1 · APCA Lc 29
Beste Textfarbe: #FFFFFF
WCAG 4.73:1 (AA) · APCA Lc 73
Contrast pairs
Code-Snippets
CSS
:root {
--prefect: #5772b0;
--prefect-rgb: 87 114 176;
--prefect-oklch: oklch(0.559 0.102 265.4);
}
.element {
color: var(--prefect);
background-color: hsl(222 36% 52%);
border-color: oklch(0.559 0.102 265.4);
}Tailwind CSS v4
@theme {
--color-prefect: #5772b0;
--color-prefect-50: #e8f5ff;
--color-prefect-100: #d9e8ff;
--color-prefect-200: #c1d4ff;
--color-prefect-300: #a0b6ec;
--color-prefect-400: #819ddb;
--color-prefect-500: #6584ca;
--color-prefect-600: #5670aa;
--color-prefect-700: #455989;
--color-prefect-800: #304266;
--color-prefect-900: #202d47;
--color-prefect-950: #101a2f;
}SCSS
$prefect: #5772b0;
$prefect-rgb: 87, 114, 176;
$prefect-light: mix(#fff, $prefect, 20%);
$prefect-dark: mix(#000, $prefect, 20%);
.element {
color: $prefect;
box-shadow: 0 0 0 2px rgba($prefect, 0.35);
}