Colore con nome · #56887D
Wintergreen Dream
Wintergreen Dream è #56887D: rgb(86 136 125), hsl(167 23% 44%), oklch(0.588 0.057 178.8). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Wintergreen Dream color name →
#56887D
oklch(0.588 0.057 178.8)
Conversioni di colore
- HEX
- #56887d
- RGB
- rgb(86 136 125)
- HSL
- hsl(167 23% 44%)
- HWB
- hwb(167 34% 47%)
- OKLCH
- oklch(0.588 0.057 178.8)
- OKLab
- oklab(0.588 -0.057 0.001)
- CIE Lab
- lab(52.91 -19.58 0.3)
- LCH
- lch(52.91 19.58 179.1)
- CMYK
- cmyk(37% 0% 8% 47%)
Tinte · Ombre · Toni
Tinte
- 679389
- 779F96
- 88ABA2
- 99B6AF
- A9C2BC
- BACEC9
- CBDAD6
- DCE6E4
- EEF3F1
Ombre
- 4A756C
- 3E635B
- 32524B
- 27413B
- 1C312C
- 12221E
- 081311
- 020605
- 000101
Toni
- 5B877D
- 60877E
- 64867E
- 69857E
- 6D847E
- 71837F
- 75837F
- 79827F
- 7C8180
Armonie di colore
Complementare +180°
- 56887D
Wintergreen Dream
- 996F7C
≈ Heritage Taffeta
Analogo -30° +30°
- 56887D
Wintergreen Dream
- 65866A
≈ Comfrey
- 52868F
≈ Night Masque
Triadico +120° +240°
- 56887D
Wintergreen Dream
- 81769A
≈ Queen of Sheba
- 97755B
≈ Dark Toast
Complementare divisa +150° +210°
- 56887D
Wintergreen Dream
- 90718E
≈ Wine Stroll
- 9C7069
≈ Bologna
Tetradico +90° +180° +270°
- 56887D
Wintergreen Dream
- 6E7C9F
≈ Inky Violet
- 996F7C
≈ Heritage Taffeta
- 8A7B55
≈ Woven Basket
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.02:1 · APCA Lc 67
Ag
AASu nero
WCAG 5.21:1 · APCA Lc 34
Miglior colore del testo: #000000
WCAG 5.21:1 (AA) · APCA Lc 34
Contrast pairs
Frammenti di codice
CSS
:root {
--wintergreen-dream: #56887d;
--wintergreen-dream-rgb: 86 136 125;
--wintergreen-dream-oklch: oklch(0.588 0.057 178.8);
}
.element {
color: var(--wintergreen-dream);
background-color: hsl(167 23% 44%);
border-color: oklch(0.588 0.057 178.8);
}Tailwind CSS v4
@theme {
--color-wintergreen-dream: #56887d;
--color-wintergreen-dream-50: #e5fbf6;
--color-wintergreen-dream-100: #d4eee9;
--color-wintergreen-dream-200: #bbddd5;
--color-wintergreen-dream-300: #98c1b9;
--color-wintergreen-dream-400: #7aaa9f;
--color-wintergreen-dream-500: #5b9387;
--color-wintergreen-dream-600: #4d7c72;
--color-wintergreen-dream-700: #3e635b;
--color-wintergreen-dream-800: #2c4942;
--color-wintergreen-dream-900: #1e332d;
--color-wintergreen-dream-950: #0e1e1a;
}SCSS
$wintergreen-dream: #56887d;
$wintergreen-dream-rgb: 86, 136, 125;
$wintergreen-dream-light: mix(#fff, $wintergreen-dream, 20%);
$wintergreen-dream-dark: mix(#000, $wintergreen-dream, 20%);
.element {
color: $wintergreen-dream;
box-shadow: 0 0 0 2px rgba($wintergreen-dream, 0.35);
}