Colore con nome · #AFD9D3
Wave Top
Wave Top è #AFD9D3: rgb(175 217 211), hsl(171 36% 77%), oklch(0.854 0.045 185.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Wave Top color name →
#AFD9D3
oklch(0.854 0.045 185.7)
Conversioni di colore
- HEX
- #afd9d3
- RGB
- rgb(175 217 211)
- HSL
- hsl(171 36% 77%)
- HWB
- hwb(171 69% 15%)
- OKLCH
- oklch(0.854 0.045 185.7)
- OKLab
- oklab(0.854 -0.045 -0.004)
- CIE Lab
- lab(83.56 -15.15 -1.82)
- LCH
- lch(83.56 15.26 186.9)
- CMYK
- cmyk(19% 0% 3% 15%)
Tinte · Ombre · Toni
Tinte
- B7DDD7
- BFE1DC
- C7E4E0
- CFE8E4
- D7ECE9
- DFF0ED
- E7F4F2
- EFF7F6
- F7FBFB
Ombre
- 98BCB7
- 81A19C
- 6B8682
- 566C69
- 415351
- 2E3B3A
- 1C2524
- 0B1110
- 010202
Toni
- AAD0CA
- A6C7C2
- A1BDB9
- 9DB4B1
- 98ACA9
- 93A3A0
- 8E9A98
- 8A9190
- 858988
Armonie di colore
Complementare +180°
- AFD9D3
Wave Top
- EAC3CA
≈ Light Blush
Analogo -30° +30°
- AFD9D3
Wave Top
- B9D8C3
≈ Cool Spring
- AFD7E2
≈ Araucana Egg
Triadico +120° +240°
- AFD9D3
Wave Top
- D6C8E7
≈ Foggy Love
- E4CAB1
≈ Grey Sand
Complementare divisa +150° +210°
- AFD9D3
Wave Top
- E3C4DA
≈ Favourite Lady
- EAC5BB
≈ Iced Cherry
Tetradico +90° +180° +270°
- AFD9D3
Wave Top
- C6CDED
≈ Ace
- EAC3CA
≈ Light Blush
- D7CFAF
≈ Pale Ivy
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.53:1 · APCA Lc 25
Ag
AAASu nero
WCAG 13.68:1 · APCA Lc 78
Miglior colore del testo: #000000
WCAG 13.68:1 (AAA) · APCA Lc 78
Contrast pairs
Frammenti di codice
CSS
:root {
--wave-top: #afd9d3;
--wave-top-rgb: 175 217 211;
--wave-top-oklch: oklch(0.854 0.045 185.7);
}
.element {
color: var(--wave-top);
background-color: hsl(171 36% 77%);
border-color: oklch(0.854 0.045 185.7);
}Tailwind CSS v4
@theme {
--color-wave-top: #afd9d3;
--color-wave-top-50: #e8faf7;
--color-wave-top-100: #d8edea;
--color-wave-top-200: #c0dbd8;
--color-wave-top-300: #9ebfbb;
--color-wave-top-400: #81a7a2;
--color-wave-top-500: #64908a;
--color-wave-top-600: #557a75;
--color-wave-top-700: #44625e;
--color-wave-top-800: #314844;
--color-wave-top-900: #21322f;
--color-wave-top-950: #101e1b;
}SCSS
$wave-top: #afd9d3;
$wave-top-rgb: 175, 217, 211;
$wave-top-light: mix(#fff, $wave-top, 20%);
$wave-top-dark: mix(#000, $wave-top, 20%);
.element {
color: $wave-top;
box-shadow: 0 0 0 2px rgba($wave-top, 0.35);
}