Named color · #0089A8
Capri Breeze
Capri Breeze is #0089A8: rgb(0 137 168), hsl(191 100% 33%), oklch(0.584 0.107 221.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Capri Breeze color name →
#0089A8
oklch(0.584 0.107 221.2)
Color conversions
- HEX
- #0089a8
- RGB
- rgb(0 137 168)
- HSL
- hsl(191 100% 33%)
- HWB
- hwb(191 0% 34%)
- OKLCH
- oklch(0.584 0.107 221.2)
- OKLab
- oklab(0.584 -0.081 -0.071)
- CIE Lab
- lab(52.18 -23.58 -25.81)
- LCH
- lch(52.18 34.96 227.6)
- CMYK
- cmyk(100% 18% 0% 34%)
Tints · Shades · Tones
Tints
- 3595B1
- 51A0BA
- 69ACC2
- 80B8CB
- 95C4D4
- ABCFDC
- C0DBE5
- D5E7EE
- EAF3F6
Shades
- 007692
- 00647C
- 005367
- 004252
- 00313F
- 00222C
- 00141A
- 00070A
- 000101
Tones
- 2588A4
- 3788A0
- 44879C
- 4F8698
- 598594
- 628590
- 6A848C
- 728288
- 798184
Color harmonies
Complementary +180°
- 0089A8
Capri Breeze
- B06447
≈ Rusty Gate
Analogous -30° +30°
- 0089A8
Capri Breeze
- 008E8A
≈ Corfu Shallows
- 487FB9
≈ Steel Blue
Triadic +120° +240°
- 0089A8
Capri Breeze
- A6618E
≈ Exotic Bloom
- 897D24
≈ Verdant
Split-complementary +150° +210°
- 0089A8
Capri Breeze
- B15F6B
≈ Cherry Kisses
- A36F28
≈ Buckthorn Brown
Tetradic +90° +180° +270°
- 0089A8
Capri Breeze
- 9068AA
≈ Amethyst Orchid
- B06447
≈ Rusty Gate
- 648841
≈ Homegrown
Contrast & accessibility
Ag
FailOn white
WCAG 4.08:1 · APCA Lc 67
Ag
AAOn black
WCAG 5.14:1 · APCA Lc 34
Best text color: #000000
WCAG 5.14:1 (AA) · APCA Lc 34
Contrast pairs
Code snippets
CSS
:root {
--capri-breeze: #0089a8;
--capri-breeze-rgb: 0 137 168;
--capri-breeze-oklch: oklch(0.584 0.107 221.2);
}
.element {
color: var(--capri-breeze);
background-color: hsl(191 100% 33%);
border-color: oklch(0.584 0.107 221.2);
}Tailwind CSS v4
@theme {
--color-capri-breeze: #0089a8;
--color-capri-breeze-50: #d5fdff;
--color-capri-breeze-100: #c2f1ff;
--color-capri-breeze-200: #a2dff6;
--color-capri-breeze-300: #77c4e0;
--color-capri-breeze-400: #49adcb;
--color-capri-breeze-500: #0095b8;
--color-capri-breeze-600: #007e9b;
--color-capri-breeze-700: #02657d;
--color-capri-breeze-800: #004b5b;
--color-capri-breeze-900: #013440;
--color-capri-breeze-950: #001f29;
}SCSS
$capri-breeze: #0089a8;
$capri-breeze-rgb: 0, 137, 168;
$capri-breeze-light: mix(#fff, $capri-breeze, 20%);
$capri-breeze-dark: mix(#000, $capri-breeze, 20%);
.element {
color: $capri-breeze;
box-shadow: 0 0 0 2px rgba($capri-breeze, 0.35);
}