Colore con nome · #887766
Sage Green
Sage Green è #887766: rgb(136 119 102), hsl(30 14% 47%), oklch(0.58 0.033 67.1). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Sage Green color name →
#887766
oklch(0.58 0.033 67.1)
Conversioni di colore
- HEX
- #887766
- RGB
- rgb(136 119 102)
- HSL
- hsl(30 14% 47%)
- HWB
- hwb(30 40% 47%)
- OKLCH
- oklch(0.58 0.033 67.1)
- OKLab
- oklab(0.58 0.013 0.03)
- CIE Lab
- lab(51.28 4.71 11.93)
- LCH
- lch(51.28 12.83 68.5)
- CMYK
- cmyk(0% 12% 25% 47%)
Tinte · Ombre · Toni
Tinte
- 938474
- 9F9183
- AA9E92
- B6ABA0
- C2B9B0
- CEC6BF
- DAD4CF
- E6E2DF
- F3F1EF
Ombre
- 756758
- 63574A
- 52473C
- 41382F
- 312A23
- 221C17
- 13100C
- 060504
- 010100
Toni
- 877869
- 86796B
- 867A6E
- 857B71
- 847C73
- 837C76
- 837D78
- 827E7B
- 817F7D
Armonie di colore
Complementare +180°
- 887766
Sage Green
- 6B7D8D
≈ Cascade Tour
Analogo -30° +30°
- 887766
Sage Green
- 8D746D
≈ Woodchuck
- 807B65
≈ Mermaid
Triadico +120° +240°
- 887766
Sage Green
- 65817E
≈ Underwater World
- 7F768A
≈ Mythical
Complementare divisa +150° +210°
- 887766
Sage Green
- 658087
≈ Blue Thunder
- 75798E
≈ Blue Granite
Tetradico +90° +180° +270°
- 887766
Sage Green
- 6B8173
≈ Wild Beet Leaf
- 6B7D8D
≈ Cascade Tour
- 887381
≈ Faded Orchid
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.30:1 · APCA Lc 70
Ag
AASu nero
WCAG 4.87:1 · APCA Lc 32
Miglior colore del testo: #000000
WCAG 4.87:1 (AA) · APCA Lc 32
Contrast pairs
Frammenti di codice
CSS
:root {
--sage-green: #887766;
--sage-green-rgb: 136 119 102;
--sage-green-oklch: oklch(0.58 0.033 67.1);
}
.element {
color: var(--sage-green);
background-color: hsl(30 14% 47%);
border-color: oklch(0.58 0.033 67.1);
}Tailwind CSS v4
@theme {
--color-sage-green: #887766;
--color-sage-green-50: #fcf4eb;
--color-sage-green-100: #efe6dc;
--color-sage-green-200: #ded2c6;
--color-sage-green-300: #c3b5a6;
--color-sage-green-400: #ac9b8a;
--color-sage-green-500: #95826f;
--color-sage-green-600: #7e6e5e;
--color-sage-green-700: #65584b;
--color-sage-green-800: #4b4037;
--color-sage-green-900: #342c25;
--color-sage-green-950: #1f1914;
}SCSS
$sage-green: #887766;
$sage-green-rgb: 136, 119, 102;
$sage-green-light: mix(#fff, $sage-green, 20%);
$sage-green-dark: mix(#000, $sage-green, 20%);
.element {
color: $sage-green;
box-shadow: 0 0 0 2px rgba($sage-green, 0.35);
}