Nazwany kolor · #8FBABC
Watchet
Watchet to #8FBABC: rgb(143 186 188), hsl(183 25% 65%), oklch(0.759 0.046 199.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Teal mean? → · Watchet color name →
#8FBABC
oklch(0.759 0.046 199.8)
Konwersje koloru
- HEX
- #8fbabc
- RGB
- rgb(143 186 188)
- HSL
- hsl(183 25% 65%)
- HWB
- hwb(183 56% 26%)
- OKLCH
- oklch(0.759 0.046 199.8)
- OKLab
- oklab(0.759 -0.043 -0.016)
- CIE Lab
- lab(72.47 -14.49 -5.96)
- LCH
- lch(72.47 15.66 202.4)
- CMYK
- cmyk(24% 1% 0% 26%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 9AC1C3
- A5C8C9
- B0CED0
- BCD5D6
- C7DCDD
- D2E3E4
- DDEAEB
- E8F1F1
- F4F8F8
Odcienie ciemniejsze
- 7CA1A3
- 69898B
- 577273
- 455C5D
- 344647
- 243232
- 151E1F
- 070D0D
- 010202
Tony
- 8EB4B6
- 8DAEB0
- 8BA8AA
- 8AA2A4
- 889D9E
- 879798
- 859192
- 848B8C
- 828686
Harmonie kolorów
Komplementarna +180°
- 8FBABC
Watchet
- CCA6A5
≈ Hydrangea Bouquet
Analogowa -30° +30°
- 8FBABC
Watchet
- 95BBAC
≈ Mild Evergreen
- 94B7C8
≈ Respite
Triada +120° +240°
- 8FBABC
Watchet
- BEA8C3
≈ Extraordinaire
- C0AE90
≈ Favourite Tan
Komplementarna rozszczepiona +150° +210°
- 8FBABC
Watchet
- C8A5B5
≈ Taste of Berry
- CAA997
≈ Pinky Beige
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.11:1 · APCA Lc 41
Ag
AAANa czerni
WCAG 9.91:1 · APCA Lc 61
Najlepszy kolor tekstu: #000000
WCAG 9.91:1 (AAA) · APCA Lc 61
Contrast pairs
Fragmenty kodu
CSS
:root {
--watchet: #8fbabc;
--watchet-rgb: 143 186 188;
--watchet-oklch: oklch(0.759 0.046 199.8);
}
.element {
color: var(--watchet);
background-color: hsl(183 25% 65%);
border-color: oklch(0.759 0.046 199.8);
}Tailwind CSS v4
@theme {
--color-watchet: #8fbabc;
--color-watchet-50: #e7f9fb;
--color-watchet-100: #d7edee;
--color-watchet-200: #bfdadc;
--color-watchet-300: #9dbfc1;
--color-watchet-400: #7fa7a9;
--color-watchet-500: #619092;
--color-watchet-600: #537a7b;
--color-watchet-700: #426163;
--color-watchet-800: #2f4748;
--color-watchet-900: #203132;
--color-watchet-950: #0f1d1e;
}SCSS
$watchet: #8fbabc;
$watchet-rgb: 143, 186, 188;
$watchet-light: mix(#fff, $watchet, 20%);
$watchet-dark: mix(#000, $watchet, 20%);
.element {
color: $watchet;
box-shadow: 0 0 0 2px rgba($watchet, 0.35);
}