Benannte Farbe · #55A7B6
Blue Calypso
Blue Calypso ist #55A7B6: rgb(85 167 182), hsl(189 40% 52%), oklch(0.683 0.083 211). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · Blue Calypso color name →
#55A7B6
oklch(0.683 0.083 211)
Farbumrechnungen
- HEX
- #55a7b6
- RGB
- rgb(85 167 182)
- HSL
- hsl(189 40% 52%)
- HWB
- hwb(189 33% 29%)
- OKLCH
- oklch(0.683 0.083 211)
- OKLab
- oklab(0.683 -0.071 -0.043)
- CIE Lab
- lab(63.8 -22.89 -15.88)
- LCH
- lch(63.8 27.86 214.8)
- CMYK
- cmyk(53% 8% 0% 29%)
Tints · Shades · Tones
Tints
- 68B0BD
- 7AB8C4
- 8BC1CC
- 9CCAD3
- ADD3DA
- BDDCE2
- CEE4E9
- DEEDF0
- EFF6F8
Shades
- 49919E
- 3D7B86
- 31666F
- 265259
- 1C3E44
- 112C30
- 081A1D
- 020A0C
- 000102
Tones
- 5CA3B1
- 619FAB
- 679BA6
- 6B98A0
- 70949B
- 739095
- 778C90
- 7A888B
- 7D8485
Farbharmonien
Komplementär +180°
- 55A7B6
Blue Calypso
- C7867A
≈ Argyle Rose
Analog -30° +30°
- 55A7B6
Blue Calypso
- 59AA9C
≈ Dragon Bay
- 69A0C8
≈ Gulf Stream Blue
Triadisch +120° +240°
- 55A7B6
Blue Calypso
- B786B1
≈ Drama Violet
- AC975C
≈ Mossy Rock
Geteilt komplementär +150° +210°
- 55A7B6
Blue Calypso
- C48496
≈ King’s Cloak
- BF8D64
≈ Eastlake Gold
Tetradisch +90° +180° +270°
- 55A7B6
Blue Calypso
- A28DC5
≈ Classic Bouquet
- C7867A
≈ Argyle Rose
- 91A167
≈ Banana Palm
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.76:1 · APCA Lc 53
Ag
AAAAuf Schwarz
WCAG 7.58:1 · APCA Lc 49
Beste Textfarbe: #000000
WCAG 7.58:1 (AAA) · APCA Lc 49
Contrast pairs
Code-Snippets
CSS
:root {
--blue-calypso: #55a7b6;
--blue-calypso-rgb: 85 167 182;
--blue-calypso-oklch: oklch(0.683 0.083 211);
}
.element {
color: var(--blue-calypso);
background-color: hsl(189 40% 52%);
border-color: oklch(0.683 0.083 211);
}Tailwind CSS v4
@theme {
--color-blue-calypso: #55a7b6;
--color-blue-calypso-50: #dbfcff;
--color-blue-calypso-100: #caf0f8;
--color-blue-calypso-200: #acdee9;
--color-blue-calypso-300: #85c3d1;
--color-blue-calypso-400: #5facba;
--color-blue-calypso-500: #3495a5;
--color-blue-calypso-600: #2e7e8c;
--color-blue-calypso-700: #256570;
--color-blue-calypso-800: #184a52;
--color-blue-calypso-900: #103339;
--color-blue-calypso-950: #021f23;
}SCSS
$blue-calypso: #55a7b6;
$blue-calypso-rgb: 85, 167, 182;
$blue-calypso-light: mix(#fff, $blue-calypso, 20%);
$blue-calypso-dark: mix(#000, $blue-calypso, 20%);
.element {
color: $blue-calypso;
box-shadow: 0 0 0 2px rgba($blue-calypso, 0.35);
}