Colore con nome · #399F86
Gossamer
Gossamer è #399F86: rgb(57 159 134), hsl(165 47% 42%), oklch(0.637 0.101 173.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Gossamer color name →
#399F86
oklch(0.637 0.101 173.7)
Conversioni di colore
- HEX
- #399f86
- RGB
- rgb(57 159 134)
- HSL
- hsl(165 47% 42%)
- HWB
- hwb(165 22% 38%)
- OKLCH
- oklch(0.637 0.101 173.7)
- OKLab
- oklab(0.637 -0.101 0.011)
- CIE Lab
- lab(59.17 -35.38 3.98)
- LCH
- lch(59.17 35.6 173.6)
- CMYK
- cmyk(64% 0% 16% 38%)
Tinte · Ombre · Toni
Tinte
- 52A991
- 68B29D
- 7CBCA9
- 90C5B5
- A2CFC1
- B5D8CD
- C8E2D9
- DAECE6
- EDF5F2
Ombre
- 308A74
- 287562
- 1F6151
- 174D40
- 103B30
- 092921
- 041813
- 010906
- 000101
Toni
- 459C85
- 4F9985
- 579684
- 5F9384
- 669083
- 6C8D82
- 718A82
- 778781
- 7B8381
Armonie di colore
Complementare +180°
- 399F86
Gossamer
- BB7090
≈ Pinky Pickle
Analogo -30° +30°
- 399F86
Gossamer
- 649B63
≈ Leafy
- 229DA7
≈ Turkish Boy
Triadico +120° +240°
- 399F86
Gossamer
- 8E7FC3
≈ Faraway Sky
- BB794E
≈ Cattle Drive
Complementare divisa +150° +210°
- 399F86
Gossamer
- A976AE
≈ Bell Heather
- C1726D
≈ Contessa
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 3.24:1 · APCA Lc 59
Ag
AASu nero
WCAG 6.47:1 · APCA Lc 42
Miglior colore del testo: #000000
WCAG 6.47:1 (AA) · APCA Lc 42
Contrast pairs
Frammenti di codice
CSS
:root {
--gossamer: #399f86;
--gossamer-rgb: 57 159 134;
--gossamer-oklch: oklch(0.637 0.101 173.7);
}
.element {
color: var(--gossamer);
background-color: hsl(165 47% 42%);
border-color: oklch(0.637 0.101 173.7);
}Tailwind CSS v4
@theme {
--color-gossamer: #399f86;
--color-gossamer-50: #d8fff4;
--color-gossamer-100: #c5f4e6;
--color-gossamer-200: #a6e3d2;
--color-gossamer-300: #7dc9b5;
--color-gossamer-400: #56b299;
--color-gossamer-500: #1e9c81;
--color-gossamer-600: #1e846d;
--color-gossamer-700: #196957;
--color-gossamer-800: #114e3e;
--color-gossamer-900: #0b362b;
--color-gossamer-950: #002118;
}SCSS
$gossamer: #399f86;
$gossamer-rgb: 57, 159, 134;
$gossamer-light: mix(#fff, $gossamer, 20%);
$gossamer-dark: mix(#000, $gossamer, 20%);
.element {
color: $gossamer;
box-shadow: 0 0 0 2px rgba($gossamer, 0.35);
}