Benannte Farbe · #7FC1D8
Ocean Horizon
Ocean Horizon ist #7FC1D8: rgb(127 193 216), hsl(196 53% 67%), oklch(0.775 0.074 222). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · Ocean Horizon color name →
#7FC1D8
oklch(0.775 0.074 222)
Farbumrechnungen
- HEX
- #7fc1d8
- RGB
- rgb(127 193 216)
- HSL
- hsl(196 53% 67%)
- HWB
- hwb(196 50% 15%)
- OKLCH
- oklch(0.775 0.074 222)
- OKLab
- oklab(0.775 -0.055 -0.05)
- CIE Lab
- lab(74.26 -17.36 -18.56)
- LCH
- lch(74.26 25.41 226.9)
- CMYK
- cmyk(41% 11% 0% 15%)
Tints · Shades · Tones
Tints
- 8DC7DC
- 9ACDE0
- A7D4E4
- B4DAE8
- C0E0EC
- CDE6F0
- D9ECF4
- E6F3F7
- F2F9FB
Shades
- 6EA7BC
- 5D8FA0
- 4C7785
- 3C5F6B
- 2D4953
- 1F343B
- 112025
- 060E11
- 010202
Tones
- 80BACF
- 81B4C6
- 81ADBD
- 82A7B4
- 82A0AB
- 829AA2
- 82939A
- 818D91
- 818689
Farbharmonien
Komplementär +180°
- 7FC1D8
Ocean Horizon
- E0A791
≈ Rose Tattoo
Analog -30° +30°
- 7FC1D8
Ocean Horizon
- 7BC5C2
≈ Booty Bay
- 93B9E5
≈ Adrift on the Nile
Triadisch +120° +240°
- 7FC1D8
Ocean Horizon
- D8A3C3
≈ Pastel Lavender
- BFB880
≈ Slippery Moss
Geteilt komplementär +150° +210°
- 7FC1D8
Ocean Horizon
- E1A3A9
≈ Berry Riche
- D4AF81
≈ Spiced Cashews
Tetradisch +90° +180° +270°
- 7FC1D8
Ocean Horizon
- C6A9D9
≈ Perfume
- E0A791
≈ Rose Tattoo
- A4C08F
≈ Gaia Stone
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.99:1 · APCA Lc 39
Ag
AAAAuf Schwarz
WCAG 10.52:1 · APCA Lc 64
Beste Textfarbe: #000000
WCAG 10.52:1 (AAA) · APCA Lc 64
Contrast pairs
Code-Snippets
CSS
:root {
--ocean-horizon: #7fc1d8;
--ocean-horizon-rgb: 127 193 216;
--ocean-horizon-oklch: oklch(0.775 0.074 222);
}
.element {
color: var(--ocean-horizon);
background-color: hsl(196 53% 67%);
border-color: oklch(0.775 0.074 222);
}Tailwind CSS v4
@theme {
--color-ocean-horizon: #7fc1d8;
--color-ocean-horizon-50: #dffaff;
--color-ocean-horizon-100: #ceeefb;
--color-ocean-horizon-200: #b3dcec;
--color-ocean-horizon-300: #8ec0d4;
--color-ocean-horizon-400: #6ba9be;
--color-ocean-horizon-500: #4791aa;
--color-ocean-horizon-600: #3d7b8f;
--color-ocean-horizon-700: #316273;
--color-ocean-horizon-800: #214854;
--color-ocean-horizon-900: #16323b;
--color-ocean-horizon-950: #071e25;
}SCSS
$ocean-horizon: #7fc1d8;
$ocean-horizon-rgb: 127, 193, 216;
$ocean-horizon-light: mix(#fff, $ocean-horizon, 20%);
$ocean-horizon-dark: mix(#000, $ocean-horizon, 20%);
.element {
color: $ocean-horizon;
box-shadow: 0 0 0 2px rgba($ocean-horizon, 0.35);
}