Nazwany kolor · #7FB9AE
Winter Surf
Winter Surf to #7FB9AE: rgb(127 185 174), hsl(169 29% 61%), oklch(0.743 0.062 181.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Winter Surf color name →
#7FB9AE
oklch(0.743 0.062 181.4)
Konwersje koloru
- HEX
- #7fb9ae
- RGB
- rgb(127 185 174)
- HSL
- hsl(169 29% 61%)
- HWB
- hwb(169 50% 27%)
- OKLCH
- oklch(0.743 0.062 181.4)
- OKLab
- oklab(0.743 -0.062 -0.001)
- CIE Lab
- lab(70.92 -21.43 -0.75)
- LCH
- lch(70.92 21.44 182)
- CMYK
- cmyk(31% 0% 6% 27%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 8CC0B6
- 99C7BE
- A6CEC6
- B3D5CE
- BFDCD6
- CCE3DE
- D9EAE6
- E6F1EE
- F2F8F7
Odcienie ciemniejsze
- 6EA097
- 5D8980
- 4C716A
- 3C5B55
- 2D4641
- 1F312E
- 111E1C
- 060D0B
- 010201
Tony
- 80B3A9
- 80ADA5
- 81A8A0
- 81A29B
- 819C97
- 819792
- 81918E
- 818B89
- 818684
Harmonie kolorów
Komplementarna +180°
- 7FB9AE
Winter Surf
- CE9CA9
≈ Pink Ice
Analogowa -30° +30°
- 7FB9AE
Winter Surf
- 8FB798
≈ Garden View
- 7DB7C2
≈ Culinary Blue
Triada +120° +240°
- 7FB9AE
Winter Surf
- B2A3CD
≈ Milky Lavender
- C9A384
≈ Rodeo Dust
Komplementarna rozszczepiona +150° +210°
- 7FB9AE
Winter Surf
- C49EBE
≈ Idyllic Pink
- D09E94
≈ Soft Sienna
Tetrada +90° +180° +270°
- 7FB9AE
Winter Surf
- 9DAAD4
≈ Tinted Lilac
- CE9CA9
≈ Pink Ice
- BAAB7E
≈ Inner Cervela
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.22:1 · APCA Lc 44
Ag
AAANa czerni
WCAG 9.45:1 · APCA Lc 58
Najlepszy kolor tekstu: #000000
WCAG 9.45:1 (AAA) · APCA Lc 58
Contrast pairs
Fragmenty kodu
CSS
:root {
--winter-surf: #7fb9ae;
--winter-surf-rgb: 127 185 174;
--winter-surf-oklch: oklch(0.743 0.062 181.4);
}
.element {
color: var(--winter-surf);
background-color: hsl(169 29% 61%);
border-color: oklch(0.743 0.062 181.4);
}Tailwind CSS v4
@theme {
--color-winter-surf: #7fb9ae;
--color-winter-surf-50: #e3fbf7;
--color-winter-surf-100: #d2efea;
--color-winter-surf-200: #b8ddd7;
--color-winter-surf-300: #94c2ba;
--color-winter-surf-400: #75aba1;
--color-winter-surf-500: #549489;
--color-winter-surf-600: #487d74;
--color-winter-surf-700: #39645d;
--color-winter-surf-800: #294a43;
--color-winter-surf-900: #1b332e;
--color-winter-surf-950: #0b1f1b;
}SCSS
$winter-surf: #7fb9ae;
$winter-surf-rgb: 127, 185, 174;
$winter-surf-light: mix(#fff, $winter-surf, 20%);
$winter-surf-dark: mix(#000, $winter-surf, 20%);
.element {
color: $winter-surf;
box-shadow: 0 0 0 2px rgba($winter-surf, 0.35);
}