Benannte Farbe · #73C0D2
Surfin’
Surfin’ ist #73C0D2: rgb(115 192 210), hsl(191 51% 64%), oklch(0.764 0.08 214.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · Surfin’ color name →
#73C0D2
oklch(0.764 0.08 214.4)
Farbumrechnungen
- HEX
- #73c0d2
- RGB
- rgb(115 192 210)
- HSL
- hsl(191 51% 64%)
- HWB
- hwb(191 45% 18%)
- OKLCH
- oklch(0.764 0.08 214.4)
- OKLab
- oklab(0.764 -0.066 -0.045)
- CIE Lab
- lab(73.23 -21.27 -16.95)
- LCH
- lch(73.23 27.2 218.5)
- CMYK
- cmyk(45% 9% 0% 18%)
Tints · Shades · Tones
Tints
- 82C6D7
- 91CDDB
- 9FD3E0
- ADD9E4
- BBE0E9
- C9E6ED
- D7ECF2
- E4F2F6
- F2F9FB
Shades
- 63A7B6
- 548E9B
- 457681
- 365F68
- 284950
- 1B3439
- 0F2024
- 050E10
- 010202
Tones
- 76BACA
- 78B3C1
- 7AADB9
- 7CA6B1
- 7DA0A8
- 7E99A0
- 7F9398
- 808D90
- 808688
Farbharmonien
Komplementär +180°
- 73C0D2
Surfin’
- E1A091
≈ Pink Palazzo
Analog -30° +30°
- 73C0D2
Surfin’
- 74C4B8
≈ Pale Jade
- 87B9E2
≈ Enchanting
Triadisch +120° +240°
- 73C0D2
Surfin’
- D3A0C7
≈ Geranium Bud
- C3B277
≈ Saucy
Geteilt komplementär +150° +210°
- 73C0D2
Surfin’
- DF9DAC
≈ Faded Pink
- D7A87C
≈ Band-Aid
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.05:1 · APCA Lc 40
Ag
AAAAuf Schwarz
WCAG 10.19:1 · APCA Lc 62
Beste Textfarbe: #000000
WCAG 10.19:1 (AAA) · APCA Lc 62
Contrast pairs
Code-Snippets
CSS
:root {
--surfin: #73c0d2;
--surfin-rgb: 115 192 210;
--surfin-oklch: oklch(0.764 0.08 214.4);
}
.element {
color: var(--surfin);
background-color: hsl(191 51% 64%);
border-color: oklch(0.764 0.08 214.4);
}Tailwind CSS v4
@theme {
--color-surfin: #73c0d2;
--color-surfin-50: #ddfcff;
--color-surfin-100: #cbeff9;
--color-surfin-200: #aeddea;
--color-surfin-300: #88c2d2;
--color-surfin-400: #63abbc;
--color-surfin-500: #3a94a7;
--color-surfin-600: #337d8d;
--color-surfin-700: #296471;
--color-surfin-800: #1b4a53;
--color-surfin-900: #12333a;
--color-surfin-950: #041f24;
}SCSS
$surfin: #73c0d2;
$surfin-rgb: 115, 192, 210;
$surfin-light: mix(#fff, $surfin, 20%);
$surfin-dark: mix(#000, $surfin, 20%);
.element {
color: $surfin;
box-shadow: 0 0 0 2px rgba($surfin, 0.35);
}