Najbliższy nazwany kolor · #8CAC72
#8CAC72
Najbliższy nazwany kolor: Sage
#8CAC72 (rgb(140 172 114), hsl(93 26% 56%), oklch(0.706 0.088 131.8)) jest najbliższy nazwanemu kolorowi Sage. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#8CAC72
oklch(0.706 0.088 131.8)
Konwersje koloru
- HEX
- #8cac72
- RGB
- rgb(140 172 114)
- HSL
- hsl(93 26% 56%)
- HWB
- hwb(93 45% 33%)
- OKLCH
- oklch(0.706 0.088 131.8)
- OKLab
- oklab(0.706 -0.059 0.066)
- CIE Lab
- lab(66.85 -19.31 26.15)
- LCH
- lch(66.85 32.51 126.4)
- CMYK
- cmyk(19% 0% 34% 33%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 97B480
- A2BC8E
- ADC59C
- B9CDAA
- C4D5B8
- D0DEC6
- DBE6D4
- E7EEE2
- F3F7F1
Odcienie ciemniejsze
- 799562
- 677F53
- 556944
- 435436
- 334028
- 232D1B
- 141B0E
- 070B04
- 010101
Tony
- 8BA874
- 8AA376
- 899F77
- 879A79
- 86967A
- 85927C
- 848D7D
- 83897E
- 81847F
Harmonie kolorów
Komplementarna +180°
- 8CAC72
Sage
- B390C8
≈ Cut Velvet
Analogowa -30° +30°
- 8CAC72
Sage
- ABA260
≈ Wavy Glass
- 6BB28F
≈ Green Bank
Triada +120° +240°
Komplementarna rozszczepiona +150° +210°
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.54:1 · APCA Lc 50
Ag
AAANa czerni
WCAG 8.25:1 · APCA Lc 52
Najlepszy kolor tekstu: #000000
WCAG 8.25:1 (AAA) · APCA Lc 52
Contrast pairs
Fragmenty kodu
CSS
:root {
--sage: #8cac72;
--sage-rgb: 140 172 114;
--sage-oklch: oklch(0.706 0.088 131.8);
}
.element {
color: var(--sage);
background-color: hsl(93 26% 56%);
border-color: oklch(0.706 0.088 131.8);
}Tailwind CSS v4
@theme {
--color-sage: #8cac72;
--color-sage-50: #ebfbe2;
--color-sage-100: #dcefd1;
--color-sage-200: #c5ddb7;
--color-sage-300: #a5c294;
--color-sage-400: #8baa73;
--color-sage-500: #709253;
--color-sage-600: #5f7c47;
--color-sage-700: #4c6339;
--color-sage-800: #384827;
--color-sage-900: #26321a;
--color-sage-950: #151e0b;
}SCSS
$sage: #8cac72;
$sage-rgb: 140, 172, 114;
$sage-light: mix(#fff, $sage, 20%);
$sage-dark: mix(#000, $sage, 20%);
.element {
color: $sage;
box-shadow: 0 0 0 2px rgba($sage, 0.35);
}