Benannte Farbe · #0089C4
Azul Caribe
Azul Caribe ist #0089C4: rgb(0 137 196), hsl(198 100% 38%), oklch(0.598 0.132 237.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Azul Caribe color name →
#0089C4
oklch(0.598 0.132 237.6)
Farbumrechnungen
- HEX
- #0089c4
- RGB
- rgb(0 137 196)
- HSL
- hsl(198 100% 38%)
- HWB
- hwb(198 0% 23%)
- OKLCH
- oklch(0.598 0.132 237.6)
- OKLab
- oklab(0.598 -0.071 -0.111)
- CIE Lab
- lab(53.25 -15.25 -40.09)
- LCH
- lch(53.25 42.89 249.2)
- CMYK
- cmyk(100% 30% 0% 23%)
Tints · Shades · Tones
Tints
- 3595CA
- 52A1D1
- 6AADD7
- 80B9DD
- 96C4E3
- ABD0E9
- C0DCEF
- D5E8F4
- EAF3FA
Shades
- 0076AA
- 006491
- 005378
- 004261
- 00314A
- 002235
- 001421
- 00070E
- 000102
Tones
- 2589BD
- 3788B7
- 4488B0
- 4F87A9
- 5986A3
- 62859C
- 6A8495
- 72838E
- 798187
Farbharmonien
Komplementär +180°
- 0089C4
Azul Caribe
- B9681D
≈ Sugar Coated Almond
Analog -30° +30°
- 0089C4
Azul Caribe
- 00909F
≈ Coral Coast
- 5D7BCE
≈ Indigo Light
Triadisch +120° +240°
- 0089C4
Azul Caribe
- BC5A80
≈ Tutti Frutti
- 7A8916
≈ Elwynn Forest Olive
Geteilt komplementär +150° +210°
- 0089C4
Azul Caribe
- C25D52
≈ Barbecue
- 9E7A00
≈ Yellowish Brown
Tetradisch +90° +180° +270°
- 0089C4
Azul Caribe
- A961A7
≈ Iris Orchid
- B9681D
≈ Sugar Coated Almond
- 3F944F
≈ Discover Deco
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.90:1 · APCA Lc 66
Ag
AAAuf Schwarz
WCAG 5.37:1 · APCA Lc 36
Beste Textfarbe: #000000
WCAG 5.37:1 (AA) · APCA Lc 36
Contrast pairs
Code-Snippets
CSS
:root {
--azul-caribe: #0089c4;
--azul-caribe-rgb: 0 137 196;
--azul-caribe-oklch: oklch(0.598 0.132 237.6);
}
.element {
color: var(--azul-caribe);
background-color: hsl(198 100% 38%);
border-color: oklch(0.598 0.132 237.6);
}Tailwind CSS v4
@theme {
--color-azul-caribe: #0089c4;
--color-azul-caribe-50: #d4fbff;
--color-azul-caribe-100: #c0efff;
--color-azul-caribe-200: #a0ddff;
--color-azul-caribe-300: #75c1f4;
--color-azul-caribe-400: #44a9e3;
--color-azul-caribe-500: #0090d2;
--color-azul-caribe-600: #007ab1;
--color-azul-caribe-700: #00628e;
--color-azul-caribe-800: #004869;
--color-azul-caribe-900: #00324a;
--color-azul-caribe-950: #001e31;
}SCSS
$azul-caribe: #0089c4;
$azul-caribe-rgb: 0, 137, 196;
$azul-caribe-light: mix(#fff, $azul-caribe, 20%);
$azul-caribe-dark: mix(#000, $azul-caribe, 20%);
.element {
color: $azul-caribe;
box-shadow: 0 0 0 2px rgba($azul-caribe, 0.35);
}