Najbliższy nazwany kolor · #7FAA66
#7FAA66
Najbliższy nazwany kolor: Sage
#7FAA66 (rgb(127 170 102), hsl(98 29% 53%), oklch(0.69 0.106 134.7)) jest najbliższy nazwanemu kolorowi Sage. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#7FAA66
oklch(0.69 0.106 134.7)
Konwersje koloru
- HEX
- #7faa66
- RGB
- rgb(127 170 102)
- HSL
- hsl(98 29% 53%)
- HWB
- hwb(98 40% 33%)
- OKLCH
- oklch(0.69 0.106 134.7)
- OKLab
- oklab(0.69 -0.074 0.075)
- CIE Lab
- lab(65.24 -24.52 30.17)
- LCH
- lch(65.24 38.88 129.1)
- CMYK
- cmyk(25% 0% 40% 33%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 8BB275
- 98BB84
- A4C394
- B1CCA3
- BED4B2
- CBDDC1
- D8E5D0
- E5EEE0
- F2F6EF
Odcienie ciemniejsze
- 6E9358
- 5D7D4A
- 4C683C
- 3C532F
- 2D3F23
- 1F2D17
- 111B0C
- 060B04
- 010100
Tony
- 7FA669
- 80A26C
- 809E6F
- 809972
- 809575
- 809177
- 808D7A
- 80897C
- 80847E
Harmonie kolorów
Komplementarna +180°
- 7FAA66
Sage
- B487C9
≈ Creeping Bellflower
Analogowa -30° +30°
- 7FAA66
Sage
- A59F4C
≈ Poplar
- 53B08B
≈ Aruba Green
Triada +120° +240°
Komplementarna rozszczepiona +150° +210°
- 7FAA66
Sage
- 9492DA
≈ Portage
- CA80AB
≈ Ice Plant
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.67:1 · APCA Lc 52
Ag
AAANa czerni
WCAG 7.84:1 · APCA Lc 50
Najlepszy kolor tekstu: #000000
WCAG 7.84:1 (AAA) · APCA Lc 50
Contrast pairs
Fragmenty kodu
CSS
:root {
--sage: #7faa66;
--sage-rgb: 127 170 102;
--sage-oklch: oklch(0.69 0.106 134.7);
}
.element {
color: var(--sage);
background-color: hsl(98 29% 53%);
border-color: oklch(0.69 0.106 134.7);
}Tailwind CSS v4
@theme {
--color-sage: #7faa66;
--color-sage-50: #e8fddf;
--color-sage-100: #d8f1ce;
--color-sage-200: #c0dfb3;
--color-sage-300: #9ec48f;
--color-sage-400: #84ac6c;
--color-sage-500: #67954b;
--color-sage-600: #587e40;
--color-sage-700: #466533;
--color-sage-800: #344a22;
--color-sage-900: #233317;
--color-sage-950: #121f08;
}SCSS
$sage: #7faa66;
$sage-rgb: 127, 170, 102;
$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);
}