Najbliższy nazwany kolor · #78B5AD
#78B5AD
Najbliższy nazwany kolor: Turquoise Fantasies
#78B5AD (rgb(120 181 173), hsl(172 29% 59%), oklch(0.729 0.064 185.5)) jest najbliższy nazwanemu kolorowi Turquoise Fantasies. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#78B5AD
oklch(0.729 0.064 185.5)
Konwersje koloru
- HEX
- #78b5ad
- RGB
- rgb(120 181 173)
- HSL
- hsl(172 29% 59%)
- HWB
- hwb(172 47% 29%)
- OKLCH
- oklch(0.729 0.064 185.5)
- OKLab
- oklab(0.729 -0.064 -0.006)
- CIE Lab
- lab(69.35 -21.86 -2.52)
- LCH
- lch(69.35 22.01 186.6)
- CMYK
- cmyk(34% 0% 4% 29%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 86BCB5
- 94C4BD
- A1CBC5
- AFD2CD
- BCDAD5
- C9E1DD
- D7E9E6
- E4F0EE
- F2F8F7
Odcienie ciemniejsze
- 679D96
- 57867F
- 486F6A
- 395955
- 2A4441
- 1D302D
- 101D1B
- 050C0B
- 010201
Tony
- 7AB0A8
- 7BAAA4
- 7CA59F
- 7DA09B
- 7E9A96
- 7F9592
- 7F908D
- 808A89
- 808584
Harmonie kolorów
Komplementarna +180°
- 78B5AD
Turquoise Fantasies
- CB97A1
≈ Cooing Doves
Analogowa -30° +30°
- 78B5AD
Turquoise Fantasies
- 87B496
≈ King Theo
- 78B2C1
≈ Glacier
Triada +120° +240°
- 78B5AD
Turquoise Fantasies
- B19EC8
≈ Purple Rose
- C4A07D
≈ Meringue Tips
Komplementarna rozszczepiona +150° +210°
- 78B5AD
Turquoise Fantasies
- C299B7
≈ Dripping Wisteria
- CC9A8C
≈ Calliope
Tetrada +90° +180° +270°
- 78B5AD
Turquoise Fantasies
- 9CA5D0
≈ Venus Flower
- CB97A1
≈ Cooing Doves
- B3A879
≈ Bamboo Forest
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.33:1 · APCA Lc 46
Ag
AAANa czerni
WCAG 9.01:1 · APCA Lc 56
Najlepszy kolor tekstu: #000000
WCAG 9.01:1 (AAA) · APCA Lc 56
Contrast pairs
Fragmenty kodu
CSS
:root {
--turquoise-fantasies: #78b5ad;
--turquoise-fantasies-rgb: 120 181 173;
--turquoise-fantasies-oklch: oklch(0.729 0.064 185.5);
}
.element {
color: var(--turquoise-fantasies);
background-color: hsl(172 29% 59%);
border-color: oklch(0.729 0.064 185.5);
}Tailwind CSS v4
@theme {
--color-turquoise-fantasies: #78b5ad;
--color-turquoise-fantasies-50: #e2fcf8;
--color-turquoise-fantasies-100: #d1efec;
--color-turquoise-fantasies-200: #b6ded9;
--color-turquoise-fantasies-300: #92c3bd;
--color-turquoise-fantasies-400: #72aba4;
--color-turquoise-fantasies-500: #50948c;
--color-turquoise-fantasies-600: #457d76;
--color-turquoise-fantasies-700: #37645f;
--color-turquoise-fantasies-800: #274a45;
--color-turquoise-fantasies-900: #1a332f;
--color-turquoise-fantasies-950: #0a1f1c;
}SCSS
$turquoise-fantasies: #78b5ad;
$turquoise-fantasies-rgb: 120, 181, 173;
$turquoise-fantasies-light: mix(#fff, $turquoise-fantasies, 20%);
$turquoise-fantasies-dark: mix(#000, $turquoise-fantasies, 20%);
.element {
color: $turquoise-fantasies;
box-shadow: 0 0 0 2px rgba($turquoise-fantasies, 0.35);
}