Couleur nommée la plus proche · #7FAA66
#7FAA66
Couleur nommée la plus proche: Sage
#7FAA66 (rgb(127 170 102), hsl(98 29% 53%), oklch(0.69 0.106 134.7)) est la plus proche de la couleur nommée Sage. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#7FAA66
oklch(0.69 0.106 134.7)
Conversions de couleur
- 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%)
Teintes · Ombres · Tons
Teintes
- 8BB275
- 98BB84
- A4C394
- B1CCA3
- BED4B2
- CBDDC1
- D8E5D0
- E5EEE0
- F2F6EF
Ombres
- 6E9358
- 5D7D4A
- 4C683C
- 3C532F
- 2D3F23
- 1F2D17
- 111B0C
- 060B04
- 010100
Tons
- 7FA669
- 80A26C
- 809E6F
- 809972
- 809575
- 809177
- 808D7A
- 80897C
- 80847E
Harmonies de couleurs
Complémentaire +180°
- 7FAA66
Sage
- B487C9
≈ Creeping Bellflower
Analogue -30° +30°
- 7FAA66
Sage
- A59F4C
≈ Poplar
- 53B08B
≈ Aruba Green
Triadique +120° +240°
Complémentaire divisée +150° +210°
- 7FAA66
Sage
- 9492DA
≈ Portage
- CA80AB
≈ Ice Plant
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.67:1 · APCA Lc 52
Ag
AAASur noir
WCAG 7.84:1 · APCA Lc 50
Meilleure couleur de texte: #000000
WCAG 7.84:1 (AAA) · APCA Lc 50
Contrast pairs
Extraits de code
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);
}