Colore con nome · #7CBC6C
Primo
Primo è #7CBC6C: rgb(124 188 108), hsl(108 37% 58%), oklch(0.732 0.129 139.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Green mean? → · Primo color name →
#7CBC6C
oklch(0.732 0.129 139.5)
Conversioni di colore
- HEX
- #7cbc6c
- RGB
- rgb(124 188 108)
- HSL
- hsl(108 37% 58%)
- HWB
- hwb(108 42% 26%)
- OKLCH
- oklch(0.732 0.129 139.5)
- OKLab
- oklab(0.732 -0.098 0.084)
- CIE Lab
- lab(70.49 -32.85 33.66)
- LCH
- lch(70.49 47.04 134.3)
- CMYK
- cmyk(34% 0% 43% 26%)
Tinte · Ombre · Toni
Tinte
- 89C37B
- 97CA8A
- A4D099
- B1D7A7
- BEDEB6
- CBE5C4
- D8EBD3
- E5F2E2
- F2F8F0
Ombre
- 6BA35D
- 5A8B4E
- 4A7340
- 3B5D32
- 2C4725
- 1E3219
- 111F0D
- 050D04
- 010200
Toni
- 7DB66F
- 7EB072
- 7FAA74
- 7FA476
- 809E78
- 80987A
- 80927C
- 808C7D
- 80867F
Armonie di colore
Complementare +180°
- 7CBC6C
Primo
- CC8DDB
≈ Blush Essence
Analogo -30° +30°
- 7CBC6C
Primo
- AEAF44
≈ Friendly Frog
- 3BC29B
≈ Macau
Triadico +120° +240°
- 7CBC6C
Primo
- 77A9F9
≈ Fennel Flower
- EE8587
≈ Steamed Salmon
Complementare divisa +150° +210°
- 7CBC6C
Primo
- A79AF4
≈ Dull Lavender
- E485B5
≈ Tempting Pink
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.26:1 · APCA Lc 45
Ag
AAASu nero
WCAG 9.26:1 · APCA Lc 58
Miglior colore del testo: #000000
WCAG 9.26:1 (AAA) · APCA Lc 58
Contrast pairs
Frammenti di codice
CSS
:root {
--primo: #7cbc6c;
--primo-rgb: 124 188 108;
--primo-oklch: oklch(0.732 0.129 139.5);
}
.element {
color: var(--primo);
background-color: hsl(108 37% 58%);
border-color: oklch(0.732 0.129 139.5);
}Tailwind CSS v4
@theme {
--color-primo: #7cbc6c;
--color-primo-50: #e1ffdd;
--color-primo-100: #d1f3cc;
--color-primo-200: #b6e3af;
--color-primo-300: #92c88a;
--color-primo-400: #75b166;
--color-primo-500: #549a42;
--color-primo-600: #488239;
--color-primo-700: #39682d;
--color-primo-800: #2b4c1d;
--color-primo-900: #1d3513;
--color-primo-950: #0d2005;
}SCSS
$primo: #7cbc6c;
$primo-rgb: 124, 188, 108;
$primo-light: mix(#fff, $primo, 20%);
$primo-dark: mix(#000, $primo, 20%);
.element {
color: $primo;
box-shadow: 0 0 0 2px rgba($primo, 0.35);
}